如何同时启动节点服务器和反应应用程序？

Question

我使用express创建了一个API，我想在我的前端服务器中使用它，问题是为了让我的API正常工作，我必须不断在服务器上运行它。但是我不能同时运行我的反应应用程序。所以我的问题是如何同时启动我的 React 服务器和 api？

PS 我同时尝试了，但我对如何让它工作感到困惑，这是我的 package.json 中的一些示例代码

{
    "name": "app",
    "version": "0.1.0",
    "private": true,
    "dependencies": {
    "@material-ui/core": "^4.1.1",
    "@material-ui/icons": "^4.2.0",
    "axios": "^0.19.0",
    "concurrently": "^4.1.0",
    "express": "^4.17.1",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "3.0.1"
  },
     "scripts": {
     "start": "node src/connection",
     "build": "react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject",
     "react": "react-scripts start",
     "dev": "concurrently \"npm start\" \"npm react\""
     },
     "proxy": "http://localhost:3000",
    "eslintConfig": {
    "extends": "react-app"
    },
    "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": []
 }
}

Answer 1

分 5 步：

1. 安装npm i --s concurrently包
2. 在Node/server/backend 的package.json中添加以下脚本

    "client": "npm start --prefix client",
    "clientinstall": "npm install --prefix client",
    "dev": "concurrently \"npm run server\" \"npm run client\"" 

3. 确保您为客户端和服务器提供了正确的路径
4. 运行“npm run dev”
5. 微笑

Answer 2

安装 npm-run-all 包，它可以帮助您执行多个脚本。您可以参考以下链接：

https://www.npmjs.com/package/npm-run-all

安装此包后，在 package.json 中添加如下脚本：

"scripts": {    
  "start-js": "react-scripts start",
  "backend-start": "NODE_ENV=production node node_api/server.js",
  "start": "concurrently \"npm-run-all -p backend-start start-js\"",
  "build": "npm-run-all build-css && react-scripts build",
  "test": "react-scripts test",
  "eject": "react-scripts eject"
}

在这里，当您运行命令“npm start”时，它首先运行“backend-start”脚本，该脚本启动后端服务器，然后开始反应。

只需更改“backend-start”脚本中的路径即可。将“node_api/server.js”替换为您的节点启动文件路径