Приложение React работает локально, но не работает на Heroku

Question

Я потратил 6 с лишним часов, пытаясь выяснить, почему это не сработает на Heroku. Он запускается локально, но при развертывании в Heroku я получаю следующий журнал, в котором просто говорится о сбое приложения. Я установил интерфейс командной строки Heroku и попытался найти более полезную ошибку, но безрезультатно. У кого-нибудь еще есть идеи или предложения?

Код => 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"
    ]
  }
}

Answer 1

Похоже, что использование heroku / nodejs для сборки было причиной проблемы. Не уверен почему, потому что я медленно добавлял к этому проекту в течение 2-3 месяцев, и он работал нормально, пока я не добавил reach-router (Но потом, когда я удалил reach router, он все равно не работал ...).

В любом случае изменение пакета сборки на исправленное: https://buildpack-registry.s3.amazonaws.com/buildpacks/mars/create-react-app.tgz

Answer 2

запустить

npm install --save serve

и затем в вашем пакете. json изменить

"start": "react-scripts start"

на

"start": "serve -s build"

На самом деле, с новой версией, есть это проблема, я не знаю почему. Это обходной путь может быть исправить это позже

Answer 3

Гаррет дал мне хорошую информацию о том, как я могу это исправить, но не объяснил, как он исправил ситуацию, я отправил ссылку здесь, если вы, ребята, не хотите бороться еще 1 час, как я:

если у вас есть реагирующее приложение и у вас та же ошибка, при изменении вашего пакета сборки с basi c heroku / node-js на create-реагировать-приложение-сборка, скорее всего, это будет исправлено:

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

затем pu sh ваше приложение реакции снова