一凿蒜、環(huán)境搭建
1、node 環(huán)境安裝
- 登錄到你的linux服務(wù)器上(針對(duì)于64位的服務(wù)器來說),然后在當(dāng)前目錄依次執(zhí)行:
cd /usr/local
mkdir node
cd node
wget https://nodejs.org/dist/v6.11.2/node-v6.11.2-linux-x64.tar.xz
xz -d node-v6.11.2-linux-x64.tar.xz
tar xvf node-v6.11.2-linux-x64.tar
mv node-v6.11.2-linux-x64 node-v6.11.2
ln -s /usr/local/node/node-v6.11.2/bin/node /usr/local/bin/node
ln -s /usr/local/node/node-v6.11.2/bin/npm /usr/local/bin/npm
- 至此听怕,node環(huán)境已經(jīng)安裝完畢,可以通過
node -v
來檢查是否安裝成功虑绵。
2尿瞭、配置node環(huán)境變量
很重要! 如果不配置環(huán)境變量翅睛,有些通過npm安裝的CLI會(huì)找不到声搁。
- 首先進(jìn)入配置文件:
vi /etc/profile
- 按 i 鍵進(jìn)入編輯模式黑竞,進(jìn)入文件末尾添加:
export NODE_HOME=/usr/local/node/node-v6.11.2/bin
export PATH=$NODE_HOME:$PATH
- 然后按 ESC 鍵 ,在控制臺(tái)輸入
:wq
疏旨,回車保存退出很魂。
注:具體的NODE_HOME路徑來自第一步你的node安裝的目錄。
3檐涝、安裝pm2模塊
pm2 是一個(gè)帶有負(fù)載均衡功能的Node應(yīng)用的進(jìn)程管理器.
- 執(zhí)行:
npm install -g pm2
- 執(zhí)行成功后遏匆,斷開當(dāng)前用戶的服務(wù)器連接,然后重新登錄谁榜。
二幅聘、 項(xiàng)目編譯
1、生成項(xiàng)目的根目錄
可以通過命令行或者手動(dòng)創(chuàng)建的方式生成項(xiàng)目根目錄窃植,如:
mkdir merchant-center
可以將merchant-center
替換成你自己的項(xiàng)目名稱帝蒿。
2、配置express環(huán)境
將該文檔的同級(jí)目錄下的app.js
和package.json
兩個(gè)文件放在你上一步生成的項(xiàng)目根目錄下巷怜,然后執(zhí)行:
npm install
確保當(dāng)前目錄下生成node_modules
文件夾葛超。
3、生成項(xiàng)目的部署文件
- 在你的react項(xiàng)目根目錄下執(zhí)行:
npm run build
- 成功后丛版,會(huì)生成dist目錄巩掺,該目錄的內(nèi)容就是你要部署到服務(wù)器上的文件。
- 你可以通過:
sup [-r] [-P port] 源路徑 user@目標(biāo)IP地址:目標(biāo)路徑
或者直接通拽的方式將該目錄內(nèi)容放置服務(wù)器上页畦,然后將dist
放在第一步生成的項(xiàng)目根目錄下胖替。此時(shí),項(xiàng)目的目錄結(jié)構(gòu)應(yīng)該是:
merchant-center //或其他項(xiàng)目名稱
|____app.js //可以打開修改里面的3000端口號(hào)
|____dist //項(xiàng)目生成的靜態(tài)文件(不要重命名TビА)
|____node_modules //express的依賴模塊
|____package.json
三独令、項(xiàng)目啟動(dòng)
首先確保你已經(jīng)按照本文檔執(zhí)行了以上的所有步驟。然后在項(xiàng)目的根目錄下執(zhí)行:
pm2 start app.js
當(dāng)你看到了這樣的日志輸出的時(shí)候好芭,說明你已經(jīng)啟動(dòng)成功了燃箭!
另外,pm2的其他命令行參考:
pm2 start app.js # 項(xiàng)目啟動(dòng)
pm2 stop all # 停止所有pm2啟動(dòng)的應(yīng)用
pm2 stop 0 # 停止進(jìn)程id為0的進(jìn)程
pm2 restart all # 重啟所有應(yīng)用
pm2 reload all # 0延遲重新加載
pm2 list # 列出所有用pm2啟動(dòng)的進(jìn)程
pm2 monit # 顯示每一個(gè)應(yīng)用的內(nèi)存和cpu使用情況
pm2 show [app-name] # 顯示當(dāng)前應(yīng)用的所有信息
pm2 logs # 顯示所有應(yīng)用的日志
pm2 logs [app-name] # 顯示當(dāng)前應(yīng)用的日志
pm2 logs --json # 以json格式展示日志
更多操作命令可以去pm2官網(wǎng)或者其github查看舍败。
至此招狸,項(xiàng)目已經(jīng)部署完成啦!
Open your browser , Enjoy it !