如何将 React 构建文件夹部署到 Heroku

Question

\xc2\xa0我在互联网上查找此内容并找到了这篇中等文章\xc2\xa0using\xc2\xa0serve。该文章指导将 packange.json 文件修改为：

\n\n

"scripts": { \n  "dev": "react-scripts \n  "start", "start": "serve -s build", \n  "build": "react-scripts build", \n  "test": "react-scripts test --env=jsdom",\n  "eject": "react-scripts eject", \n  "heroku-postbuild": "npm run build" \n},\n

\n\n

现在这适用于\xc2\xa0development。我收到控制台日志说\xc2\xa0Content 已缓存以供离线使用。谷歌 Lighthouse 为我提供了超过 90% 的渐进式网络应用程序。问题是，当我部署到\xc2\xa0Heroku时，在构建过程中它运行package.json脚本中指定的\xc2\xa0npm run build\xc2\xa0。但打开应用程序后，我在 firehouse 中的性能获得了 21%，渐进式 Web 应用程序获得了 50%。另外，它说\xc2\xa0service工作人员未注册。这意味着它不是从构建文件夹提供的。作为额外的，我在开发计算机中运行\xc2\xa0npm build\xc2\xa0myself 并将项目与构建文件夹一起部署，但结果仍然相同。现在我还看到了另一篇文章，建议使用 node.js 服务器并将 package.json 中的脚本更改为：

\n\n

start: "node server.js"\n

\n\n

我对node.js一无所知，所以我决定在这里咨询以获得更好的选择。

\n\n

编辑：如果需要服务器命令，就像第二篇中等文章中的node.js 和下面 Garesh 的 php 代码中一样 - 如果有人可以帮助使用 python(django) 中的类似代码，那就是好的

\n

Answer 1

在网上的评论中找到了这个问题的答案：

在部署应用程序之前，请转到：Heroku 仪表板 > 设置 > buildpacks > 添加 buildpacks，然后添加 github.com/mars/create-react-app-b...

或者，在命令行中你可以这样做

heroku buildpacks：设置 github.com/mars/create-react-app-b...

如果您不执行此步骤，heroku 将部署您的 React 应用程序的开发版本（速度很慢），而不是优化的生产版本。