Search code examples
node.jsherokuyarnpkg

How to solve the Error in deploying react app on Heroku


I run yarn install and yarn start locally for my project and it works fine. However, as soon as I push it to Heroku, I am unable to deploy it with the following error log:

2021-05-10T16:40:06.622555+00:00 app[web.1]: > react-scripts start
2021-05-10T16:40:06.622556+00:00 app[web.1]: 
2021-05-10T16:40:06.627252+00:00 app[web.1]: sh: 1: react-scripts: not found
2021-05-10T16:40:06.636894+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2021-05-10T16:40:06.637303+00:00 app[web.1]: npm ERR! syscall spawn
2021-05-10T16:40:06.637496+00:00 app[web.1]: npm ERR! file sh
2021-05-10T16:40:06.637766+00:00 app[web.1]: npm ERR! errno ENOENT
2021-05-10T16:40:06.644457+00:00 app[web.1]: npm ERR! [email protected] start: `react-scripts start`
2021-05-10T16:40:06.644627+00:00 app[web.1]: npm ERR! spawn ENOENT
2021-05-10T16:40:06.644771+00:00 app[web.1]: npm ERR!
2021-05-10T16:40:06.644922+00:00 app[web.1]: npm ERR! Failed at the [email protected] start script.
2021-05-10T16:40:06.645043+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2021-05-10T16:40:06.654910+00:00 app[web.1]: 
2021-05-10T16:40:06.655128+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2021-05-10T16:40:06.655306+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2021-05-10T16_40_06_646Z-debug.log
2021-05-10T16:40:06.706089+00:00 heroku[web.1]: Process exited with status 1
2021-05-10T16:40:06.778374+00:00 heroku[web.1]: State changed from starting to crashed
2021-05-10T16:41:26.103511+00:00 app[api]: Deploy 1f4ec645 by user [email protected]
2021-05-10T16:41:26.103511+00:00 app[api]: Release v7 created by user [email protected]
2021-05-10T16:41:26.390448+00:00 heroku[web.1]: State changed from crashed to starting
2021-05-10T16:41:30.000000+00:00 app[api]: Build succeeded
2021-05-10T16:41:32.398941+00:00 heroku[web.1]: Starting process with command `npm start`

In addition, I do only contain the yarn.lock in my directory so I am confused why it still runing npm. And here is my package.json file:

{
  "name": "bleh",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "react-scripts": "0.9.0"
  },
  "dependencies": {
    "react": "^15.4.2",
    "react-dom": "^15.4.2",
    "react-fontawesome": "^1.6.1",
    "react-infinite": "^0.11.2",
    "react-infinite-loader": "^1.0.2",
    "react-router": "^3.0.2"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}


Solution

  • You need to have a back-end server like node with express and config the script npm start. Go to Package.json --> scripts --> and add the script --> "start": "node app or index" depend of your root file. Btw you need to put the react application on the public folder of your backend.

    Heroku needs a backend to start correctly.

    You can see the express setup https://www.npmjs.com/package/express or http://expressjs.com/en/starter/hello-world.html