前端和后端連載一起啟動

前言

在開發的時候，有時在命令工具里面，要多開兩個窗口分別啟動前端項目和后端服務接口，有沒有辦法將整個項目一起啟動呢

答案是有，前端和后端連載一起啟動，適用於前端為vue或React，后端為nodejs的項目。

只需用到一個npm包concurrently模塊，通過package.json配置實現。

假設你是vue+nodejs項目，項目根目錄為server，vue前端部分放於client目錄下

 

配置開始

1.在項目根路徑server下安裝concurrently模塊

cnpm install  concurrently -S

2.配置client下的package.json

"scripts": {
  "serve": "vue-cli-service serve",
  "build": "vue-cli-service build",
 + "start": "npm run serve"
},

3.配置項目根目錄server下的package.json

"scripts": {
 + "client-install": "npm install --prefix client",
 + "client": "npm start --prefix client",
  "start": "node server.js",
  "server": "nodemon server.js",
 + "dev": "concurrently \"npm run server\" \"npm run client\""
},

4.啟動前后端

npm run dev

更多用法見

 

https://github.com/kimmobrunfeldt/concurrently