在生产环境中部署ReactJS应用程序（带有nodeJS后端）

小编典典

在生产环境中部署ReactJS应用程序（带有nodeJS后端）

reactjs

我们的项目现已结束，我们只有两周的时间将项目退还给我们在大学的最后一年的学习。我们的老师告诉我们，现在开发阶段已经结束，我们必须在生产阶段进行部署。

我们将ReactJS用于前端（托管在localhost：// 3000中），将NodeJS用于服务器/数据库管理（托管在localhost：//
3004中）。

到目前为止，我已经对 如何部署
进行了一些研究（老师说，理想情况下，它是一个zip文件，我们可以将其插入到网页中，就像html一样，并且可以正常工作）。

到目前为止，我还没有做到这一点。许多人建议使用“
webpack”来管理它，但是我们一开始就没有配置它，因为我们对reactJS毫无头绪，而且我不知道我们现在是否可以这样做。我已经阅读了教程等，并尝试使用NODE_ENV进行某些操作，但直到现在我仍然遇到错误。

谁能帮助我和我的队友？

提前致谢！

阅读 564

2020-07-22

共1个答案

小编典典

我假设您使用create-react-app来生成您的react项目。我的文件夹结构如下：

客户（这是我的应用程序）
配置
控制器
路线
楷模
index.js（express应用位于index.js中）
package.json

接下来，我将应用程序部署到Heroku：

在package.json中，将此行添加到脚本中"heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client"。
然后"engines": { "node" : "[your node version]" }在脚本之后添加此内容。
在index.js中，将以下代码放在路由设置之后

        if (process.env.NODE_ENV === "production") {
      app.use(express.static("client/build"));
      const path = require("path");
      app.get("*", (req, res) => {
        res.sendFile(path.resolve(__dirname, "client", "build", "index.html"));
      });
    }

我假设您使用git进行版本控制，并且已经安装了heroku。打开您的终端，然后heroku登录-> heroku创建-> git push heroku master。如果没有任何错误，则说明您可以成功部署应用程序。

这是我将我的应用程序部署到Heroku的GitHub
https://github.com/dnp1204/instagrom。我希望它会给你一些思路

希望你能成功！

2020-07-22