詳解基于Vue+Koa的pm2配置

更新時(shí)間：2017年10月24日 14:12:43 作者：Black-Hole''s Blog

這篇文章主要介紹了詳解基于Vue+Koa的pm2配置，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧

目前使用的技術(shù)棧是：前端Vue、后端Koa、數(shù)據(jù)庫Mongodb。

然而每當(dāng)起服務(wù)的時(shí)候，都要 npm start 、 node ./server/app.js ，還要同時(shí)保持這兩個(gè)窗口一直是開著的，很是麻煩。

而且因?yàn)槲沂褂玫氖莐oa，也沒有使用狼叔寫的koa腳手架。是自己基于廖雪峰老師的 Koa框架改的一個(gè)小型mvc。導(dǎo)致沒有熱更新。

為了簡化這種沒必要的操作及增加熱更新，開始想怎么進(jìn)行優(yōu)化。于是選擇了 pm2

配置pm2

先安裝pm2： npm i pm2 、 npm i pm2 -g

因?yàn)槭情_源項(xiàng)目，為了讓代碼能再別人的電腦上跑起來，需要讓pm2存在項(xiàng)目里。然后在全局安裝，方便后期調(diào)試

再項(xiàng)目的根目錄里創(chuàng)建logs目錄

在當(dāng)前的目錄創(chuàng)建一個(gè)pm2.json的文件，內(nèi)容如下：

{
 "apps": [{
  "name": "koler-server",
  "script": "./app.js",
  "error_file"   : "../logs/server-err.log",
  "out_file"    : "../logs/server-out.log",
  "merge_logs"   : true,
  "log_date_format" : "YYYY-MM-DD HH:mm Z",
  "cwd": "./server",
  "watch": [
   "app.js",
   "controllers"
  ],
  "watch_options": {
   "followSymlinks": false
  }
 },{
  "name": "koler-app",
  "script": "./build/dev-server.js",
  "error_file"   : "./logs/app-err.log",
  "out_file"    : "./logs/app-out.log",
  "merge_logs"   : true,
  "log_date_format" : "YYYY-MM-DD HH:mm Z",
  "cwd": "./",
  "ignore_watch" : [
   "node_modules"
  ],
  "watch_options": {
   "followSymlinks": false
  }
 }]
}

這里同時(shí)啟動兩個(gè)項(xiàng)目。

koler-server 是koa， koler-app 是前端vue。

我嘗試了一下把

"error_file"   : "./logs/app-err.log",
"out_file"    : "./logs/app-out.log",
"merge_logs"   : true,
"log_date_format" : "YYYY-MM-DD HH:mm Z",

代碼提升到j(luò)son的根部，但是發(fā)現(xiàn)不起作用。看來pm2不支持這種。所以只能在每個(gè)服務(wù)里寫了。

配置package.json

替換之前的 script 字段下的 dev ，然后再增加 stop 字段，替換后如下：

"scripts": {
 "dev": "pm2 start pm2.json && pm2 logs",
 "start": "npm run dev",
 "stop": "pm2 stop koler-app koler-server && pm2 delete koler-app koler-server",
 "build": "node build/build.js",
 "lint": "eslint --ext .js,.vue src"
},

pm2 start pm2.json && pm2 logs 是基于pm2.json文件配置啟動，后面的 pm2 logs 是為了同時(shí)跟蹤vue和koa的反饋日志。

輸入 npm start 后。終端如下：

我這里不知道為什么。每次 npm start 都會爆出來如下的錯(cuò)誤：

1|koler-ap | 2017-10-23 19:45 +08:00:
1|koler-ap | ┌────────────────────────────────────────────────────────────┐
1|koler-ap | │         npm update check failed          │
1|koler-ap | │      Try running with sudo or get access       │
1|koler-ap | │      to the local update config store via      │
1|koler-ap | │ sudo chown -R $USER:$(id -gn $USER) C:\Users\158bl\.config │
1|koler-ap | └────────────────────────────────────────────────────────────┘

單獨(dú)啟動是沒有任何問題的，但是項(xiàng)目還是能照常跑起來。可能是nodejs或者pm2的bug吧(因?yàn)椴恢朗悄睦锏腷ug，就不去github上提issue了)

啟動后，你的屏幕會出現(xiàn)一個(gè)cmd窗口，不用關(guān)，過一會它會自行關(guān)閉的。每次修改代碼觸發(fā)pm2配置文件里 watch 規(guī)則時(shí)，就會自動彈出一個(gè)cmd窗口，也是過一會關(guān)閉。

因?yàn)槠渌?xiàng)目使用者可能會在電腦上跑多個(gè)pm2實(shí)例，所以在 stop 字段里，我跟上了名字。防止出現(xiàn)把所有的實(shí)例全部暫定刪除了。

測試

現(xiàn)在我們更改代碼發(fā)現(xiàn)沒有任何問題，pm2會幫助我們自動進(jìn)行熱更新。現(xiàn)在我們故意改錯(cuò)一段vue的代碼試試：