将React App部署到Heroku并给出H10错误代码

时间:2020-05-03 17:15:37

标签: reactjs heroku create-react-app

我使用create-react-app创建了一个react应用。它在我的本地服务器上运行良好。但是当我尝试将其部署到heroku时,它崩溃了。我不知道为什么它崩溃了。 / p>

heroku logs --tail中显示为error code=H10 desc=App crashed。我搜索了这个问题,对我没有帮助。

我的问题类似于以下问题:React app runs locally, crashes when on Heroku error code=H10

但是我无法理解他们给出的解决方案。

我的package.json文件如下:

{
  "name": "lets-chat",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.28",
    "@fortawesome/free-brands-svg-icons": "^5.13.0",
    "@fortawesome/free-regular-svg-icons": "^5.13.0",
    "@fortawesome/free-solid-svg-icons": "^5.13.0",
    "@fortawesome/react-fontawesome": "^0.1.9",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "dotenv": "^8.2.0",
    "firebase": "^7.14.0",
    "moment": "^2.24.0",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-router-dom": "^5.1.2",
    "react-scripts": "3.4.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

我不知道此文件有什么问题。我应该对此文件进行任何更改以解决问题吗?

heroku logs --tail提供了以下报告: enter image description here

3 个答案:

答案 0 :(得分:1)

查看此链接(以防其他帖子中的解决方案对您的情况有所帮助):https://dev.to/webdevraj/deploy-a-react-app-on-heroku-the-right-way-5efo 注意#6,其中提到了buildpack。

答案 1 :(得分:0)

我也有同样的问题。我可以弄清楚这与react版本有关。 我更改了版本,它起作用了。在package.json中更新您的版本,并查看其是否有效。

"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-router-dom": "^5.1.2",
"react-scripts": "3.2.0"

答案 2 :(得分:0)

使用create-react-app并部署到

  1. 不要删除favicon.ico和manifest.json

  2. 也在package.json以上脚本中插入“ engines”:{ “ npm”:“ 6.x”, “ node”:“ 12.x” }

//注意通过键入npm -v和node -v来检查节点和NPM版本以获取准确的版本//

  1. 在heroku创建命令之后的heroku中,转到heroku并将设置下的构建方式更改为https://github.com/mars/create-react-app-buildpack

不要添加其他脚本或更改开始,构建脚本!

这应该清除在部署到heroku时的所有h10错误,如果我不建议您创建一个新目录并在该目录中复制文件并重新开始,则此链接是部署的绝佳指南

https://dev.to/smithmanny/deploy-your-react-app-to-heroku-2b6f