React 应用程序在本地运行，在 Heroku 错误代码 = H10 时崩溃

Posted 2023-02-22

【中文标题】React 应用程序在本地运行，在 Heroku 错误代码 = H10 时崩溃

【英文标题】：React app runs locally, crashes when on Heroku error code=H10

【发布时间】：2017-11-03 07:52:31

【问题描述】：

在 Windows 中执行“npm start”后，该应用程序运行良好，但是当我从 github 拉入 Heroku 时，我得到了一个错误。

package.json:

  "name": "tic-tac-toe",
  "version": "0.1.0",

  "dependencies": 
    "react": "^15.5.4",
    "react-dom": "^15.5.4"
  ,
  "engines": 
      "node": "6.10.3",
      "npm":"3.10.10"
  ,
  "devDependencies": 
    "react-scripts": "1.0.7"
  ,
  "scripts": 
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  

和错误日志：

 app[web.1]: npm ERR!     npm bugs tic-tac-toe
 app[web.1]: npm ERR! Or if that isn't available, you can get their info via:
 app[web.1]: npm ERR!     npm owner ls tic-tac-toe
 app[web.1]: npm ERR! There is likely additional logging output above.
 app[web.1]: 
 app[web.1]: npm ERR! Please include the following file with any support request:
 app[web.1]: npm ERR!     /app/npm-debug.log
 heroku[web.1]: Process exited with status 1
 heroku[web.1]: State changed from starting to crashed
 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-tac-to.herokuapp.com request_id=c3cf2461-1989-4734-a7d5-157eb81c9643 fwd="24.29.73.46" dyno= connect= service= status=503 bytes= protocol=https
 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-tac-to.herokuapp.com request_id=05109629-cbb4-4927-9d13-8a3a37fedb93 fwd="24.29.73.46" dyno= connect= service= status=503 bytes= protocol=https

问题的性质让我认为这是基于配置的，而不是在 app.js 主代码中。 主文件有点长，如果你想看的话，我会在 Github 上链接： https://github.com/owenpercoco/React-Tac-Toe

【问题讨论】：

一目了然，能确认react-scripts安装正确吗？我相信 heroku 默认会忽略 devDependencies 模块。将其移至dependencies 列表或许可以解决此问题。

感谢@hainq 这解决了我的问题..

【参考方案1】：

我遇到了同样的问题，但上面的解决方案不适用于我在 Heroku 中的 react 应用程序。 我已将构建包更新为 create-react-app，它对我有用。

heroku buildpacks:set mars/create-react-app

【讨论】：

工作就像一个魅力

【参考方案2】：

只需 npm i serve 安装 serve 或者你可以使用 yarn 代替 npm

您可以在 package.json 文件中更改您的脚本，这似乎是由 react 更新引起的。

"scripts": 
"dev": "react-scripts start",
"start": "serve -s build",
"build": "react-scripts build",
"heroku-postbuild": "npm run build"

希望它能解决您的问题。

【参考方案3】：

我遇到了同样的问题，它对我有用。

将“服务”添加到应用程序。

示例： npm add serve or yarn add serve

在 package.json 中更改脚本后

"scripts": 
  "dev": "react-scripts start",
  "start": "serve -s build",
  "build": "react-scripts build",
  "heroku-postbuild": "npm run build"

【参考方案4】：

Heroku 默认不安装 devdependencies：。 https://devcenter.heroku.com/articles/nodejs-support。将您的 react-scripts 模块设置为始终安装或关闭 Heroku 上的生产模式。

【讨论】：

我遇到了同样的问题，但我没有得到您的解决方案。您能详细说明一下吗？

Vasu，我在基本干净的创建反应应用程序中遇到了同样的问题。这是我必须更改的内容：将"heroku-postbuild": "npm run build" 添加到我的脚本中，然后我运行“yarn add serve --save”以将“服务”命令添加到我的依赖项中，然后我将“启动”脚本更改为："start": "serve -s build",根据下面 Sufyan 的回答。我希望这会有所帮助。

感谢 MarkW。可能会通过“脚本”添加您指的是package.json 文件的一部分。

【参考方案5】：

1.) npm install serve --save 或 yarn install serve --save 在您的终端中

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

2.) 在我的 package.json 文件中复制上述代码以代替之前的代码“脚本”

3.) git commit -am "new update"

4.) git push heroku master

注意：常见问题是缺少第一步。

【讨论】：

哇！终于解决了我的问题！唯一的问题是我不知道为什么....

@Dardar，如果第一步是您的情况，那是因为 Heroku 要求在您的依赖项上有“服务”，那么它将能够处理。跨度>