一、環(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)文件（不要重命名?。? |____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)成功了！
啟動(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 !
