NPM 使用 React + Node + 同时运行构建如何？

Posted 2023-02-22

【中文标题】NPM 使用 React + Node + 同时运行构建如何？

【英文标题】：NPM run build with React + Node + concurrently How to?

【发布时间】：2020-06-12 15:13:09

【问题描述】：

我花了几个小时试图弄清楚这一点，欢迎提出任何建议。这里的目标是组装一个构建后脚本，该脚本将在运行反应客户端的 nodeJS 应用程序上运行。

React 在 3000 后，节点在 5000。所以它需要 并发 库。以下是do-postbuild 和heroku-postbuild 的两次尝试（均失败）。

  "scripts": 

    "server": "nodemon server.js --ignore client",
    "client": "npm start --prefix ../client",
    "dev": "concurrently \"npm run server\" \"npm run client\" ",
    "do-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix && npm run build --prefix client",
    "heroku-postbuild": "cd ../client && npm install && npm install --only=dev --no-shrinkwrap && npm run build" 
  ,

文件夹结构

client
server
   |_package.json (above)
   |_server.js

npm run dev - 完美运行

当我尝试npm run heroku-postbuild 时，它会产生以下结果：

npm ERR! errno 1
npm ERR! ver1.02@1.0.0 heroku-postbuild: `cd client && npm install && npm install --only=dev --no-shrinkwrap && npm run build`
npm ERR! Exit status 1

当尝试写入 npm run do-postbuild 时，它会抛出一个错误，就像它在 server 文件夹中搜索 client 一样

npm ERR! errno -2
npm ERR! enoent ENOENT: no such file or directory, open '/Users/sites/server/client/package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent 

【问题讨论】：

你是怎么解决这个问题的？

我停止同时使用客户端和服务器的生产版本。有人对解决方案投了反对票，但它对我来说非常有效。

你是如何在heroku上分别部署客户端和服务器的？

我在 Heroku 上进行了第一次生产构建（同时学习 Node/React），有很多指南。对我来说，这一天将会到来，您必须能够在本机 LINUX Box 上进行部署，我就是这样做的。

【参考方案1】：

在你的脚本中添加这个

 "client-install": "npm install --prefix client",

【参考方案2】：

请添加以下脚本并尝试，它将 100% 工作。

 "scripts":  

 "client-install": "npm install --prefix client",
      "start": "node server.js",
      "server": "nodemon server.js",
      "client": "npm start --prefix client",
      "dev": "concurrently \"npm run server\" \"npm run client\"",
      "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client"
     

【参考方案3】：

这不是 HEROKU 解决方案，它适用于具有 root 访问权限的通用 UBUNTU 服务器。

这里的解决方案是您不必将应用程序 dockerize 为一个包（客户端和服务器一起）。

对我有用的是将客户端和服务器视为两个不同的应用程序。

客户端：

npm run build 本地来自与您的 package.json 文件相同的文件夹 然后将应用程序 build folder 发布为使用 html CSS javascript 的非常直接的客户端应用程序

服务器端：

上传server文件（不包括node_modules文件夹） 运行npm i（从包含 package.json 文件的文件夹中） 我设置了反向代理以将端口映射到服务器上的特定位置，以便反应到达它 设置 cron 作业以启动服务器端（并定期检查以确保它正在运行）

就是这样 - 完美运行。

【讨论】：

抱歉，我否决了这个答案，无法更改。如果您以某种方式对其进行编辑，我将有机会再次投票

请立即尝试 - 您从包含 package.json 文件的文件夹中进行构建。