• 使用 concurrently 并行地运行多个命令(同时跑前端和后端的服务)


    我现在有一个项目是这样的,前端是用 React 写的,后端是用 Nodejs,目录结构如下:

    1 .
    2 ├── README.md
    3 ├── backend
    4 ├── node_modules
    5 ├── package.json
    6 ├── public
    7 ├── src
    8 └── yarn.lock

    这个 package.json 的内容如下:

     1 {
     2   "name": "crudtest",
     3   "version": "0.1.0",
     4   "private": true,
     5   "dependencies": {
     6     "classnames": "^2.2.5",
     7     "concurrently": "^3.5.1",
     8     "react": "^16.2.0",
     9     "react-dom": "^16.2.0",
    10     "react-redux": "^5.0.7",
    11     "react-router-dom": "^4.2.2",
    12     "react-scripts": "1.1.1",
    13     "redux": "^3.7.2",
    14     "redux-thunk": "^2.2.0"
    15   },
    16   "scripts": {
    17     "start": "react-scripts start",
    18     "build": "react-scripts build",
    19     "test": "react-scripts test --env=jsdom",
    20     "eject": "react-scripts eject",
    21   },
    22   "devDependencies": {
    23     "redux-devtools-extension": "^2.13.2"
    24   },
    25   "proxy": "http://localhost:8080"
    26 }

    而后端项目是放在 backend 这个目录中,其目录结构如下:

    1 backend
    2 ├── etc
    3 ├── node_modules
    4 ├── package-lock.json
    5 ├── package.json
    6 └── server.js

    它的 package.json 文件,内容如下:

     1 {
     2   "name": "backend",
     3   "version": "1.0.0",
     4   "description": "",
     5   "main": "server.js",
     6   "scripts": {
     7     "test": "echo "Error: no test specified" && exit 1",
     8     "start": "nodemon --exec babel-node -- ./server.js"
     9   },
    10   "keywords": [],
    11   "author": "",
    12   "license": "ISC",
    13   "dependencies": {
    14     "body-parser": "^1.18.2",
    15     "express": "^4.16.2",
    16     "mongodb": "^3.0.4"
    17   },
    18   "devDependencies": {
    19     "babel-cli": "^6.26.0",
    20     "babel-preset-es2015": "^6.24.1",
    21     "nodemon": "^1.17.1"
    22   }
    23 }

    现在前端项目要运行起来简单,只要运行如下命令即可。

    $ npm run start

    就会跑 3000 端口。

    那么要运行服务器的程序的话,可能要这样:

    1 $ cd backend
    2 $ npm run start

    就会跑 8080 端口。

    那么有没有一种方法同时运行两个服务呢?

    就是用一条命令跑两个服务。

    解决方法如下:

    1、在项目根目录下,运行:

    1 $ npm i concurrently --save
    2 3 $ yarn add concurrently
    1. 然后更改 package.json 文件,如下:
     1 {
     2   "name": "crudtest",
     3   "version": "0.1.0",
     4   "private": true,
     5   "dependencies": {
     6     "classnames": "^2.2.5",
     7     "concurrently": "^3.5.1",
     8     "react": "^16.2.0",
     9     "react-dom": "^16.2.0",
    10     "react-redux": "^5.0.7",
    11     "react-router-dom": "^4.2.2",
    12     "react-scripts": "1.1.1",
    13     "redux": "^3.7.2",
    14     "redux-thunk": "^2.2.0"
    15   },
    16   "scripts": {
    17     "start": "react-scripts start",
    18     "build": "react-scripts build",
    19     "test": "react-scripts test --env=jsdom",
    20     "eject": "react-scripts eject",
    21     "server": "npm start --prefix backend",
    22     "dev": "concurrently "npm run server" "npm run start""
    23   },
    24   "devDependencies": {
    25     "redux-devtools-extension": "^2.13.2"
    26   },
    27   "proxy": "http://localhost:8080"
    28 }

    主要添加了下面这两行:

    1 "server": "npm start --prefix backend",
    2 "dev": "concurrently "npm run server" "npm run start""

    有了 --prefix backend 就不用 cd backend 了,也就是说运行 npm run server 就会跑后端的服务,相当于:

    1 $ cd backend
    2 $ npm run start

    最后运行 npm run dev 相当于同时运行下面两条命令:

    1 $ npm run server
    2 $ npm run start

    界面如下:

    原文访问

  • 相关阅读:
    IDEA中Maven依赖下载失败解决方案
    Java 泛型 泛型的约束与局限性
    年轻就该多尝试,教你20小时Get一项新技能
    Java入门
    2020全球C++及系统软件技术大会成功落下帷幕
    hashMap底层源码浅析
    hashMap底层源码浅析
    RabbitMQ (二) 简单队列
    RabbitMQ (一) 简介和基本概念
    Linux 关闭/开启密码登录(仅证书登录)
  • 原文地址:https://www.cnblogs.com/joyco773/p/11403804.html
Copyright © 2020-2023  润新知