React应用程序在本地运行,但在Heroku上崩溃

时间:2020-04-05 15:12:26

标签: reactjs heroku

我花了6个小时以上的时间来弄清楚为什么它无法在Heroku上成功运行。它在本地运行,但是当我部署到Heroku时,我得到的以下日志基本上只是说应用程序崩溃了。我安装了Heroku的CLI,并尝试在其中找到一个更有用的错误,但无济于事。其他人有什么想法或建议吗?

代码=> https://github.com/ghughes13/react-todo-list

https://ghughes-react-todo-list.herokuapp.com/

2020-04-05T14:46:31.351885+00:00 app[web.1]: [34mℹ[39m [90m「wds」[39m: Project is running at http://172.18.176.170/
2020-04-05T14:46:31.355002+00:00 app[web.1]: [34mℹ[39m [90m「wds」[39m: webpack output is served from 
2020-04-05T14:46:31.355159+00:00 app[web.1]: [34mℹ[39m [90m「wds」[39m: Content not from webpack is served from /app/public
2020-04-05T14:46:31.355252+00:00 app[web.1]: [34mℹ[39m [90m「wds」[39m: 404s will fallback to /
2020-04-05T14:46:31.355468+00:00 app[web.1]: Starting the development server...
2020-04-05T14:46:31.355470+00:00 app[web.1]: 
2020-04-05T14:46:31.498661+00:00 heroku[web.1]: State changed from starting to crashed
2020-04-05T14:46:33.839876+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=ghughes-react-todo-list.herokuapp.com request_id=199836cb-d38a-4941-aee7-fc5e5deba5dc fwd="97.99.41.155" dyno= connect= service= status=503 bytes= protocol=https
2020-04-05T14:46:34.454912+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=ghughes-react-todo-list.herokuapp.com request_id=b905fff4-83bf-4319-801a-c2c4f1d7a4e1 fwd="97.99.41.155" dyno= connect= service= status=503 bytes= protocol=https
  "name": "todo-list",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@reach/router": "^1.3.3",
    "axios": "^0.19.2",
    "mongodb": "^3.5.2",
    "mongodb-client-encryption": "^1.0.1",
    "mongoose": "^5.8.11",
    "reach": "^1.0.1",
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "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"
    ]
  }
}

3 个答案:

答案 0 :(得分:4)

Garrett给了我很好的信息,说明了如何解决它,但没有解释他如何清楚地解决问题,我在这里发送了链接,以防你们不想再像我一样挣扎一小时了。

如果您具有react-app并在将您的buildpack从基本heroku / node-js更改为create-react-app-buildpack时遇到相同的错误,则很可能会解决此问题:

https://elements.heroku.com/buildpacks/mars/create-react-app-buildpack

在终端/ cmd上:

   heroku buildpacks:set https://github.com/mars/create-react-app-buildpack.git#v6.0.0

然后再次推送您的react-app

答案 1 :(得分:3)

运行

npm install --save serve

然后在package.json中更改

"start": "react-scripts start"

"start": "serve -s build"

实际上,对于新版本,存在一个我不知道为什么的问题。这是一个变通办法,可能会在以后解决。

答案 2 :(得分:2)

因此,似乎使用heroku / nodejs进行构建导致了问题。不知道为什么,因为我一直在缓慢地添加到此项目中2-3个月,直到我添加了到达路由器为止,它都可以正常工作(但是当我删除到达路由器时,它仍然无法正常工作...)。

无论如何将构建包更改为此都可以解决: https://buildpack-registry.s3.amazonaws.com/buildpacks/mars/create-react-app.tgz