have an error when deploy react app in heroku

Question

I created a react frontend app and worked in my pc but after deployed it in heroku, it is not working. I tried to figure it using heroku logs but didn't find a solution.I ran npm clean-install but it didn't work too.I google it but have no solution.

2021-05-13T08:38:04.301640+00:00 heroku[web.1]: Starting process with command `npm start`
2021-05-13T08:38:06.727155+00:00 app[web.1]:
2021-05-13T08:38:06.727195+00:00 app[web.1]: > [email protected] start /app
2021-05-13T08:38:06.727196+00:00 app[web.1]: > react-scripts start
2021-05-13T08:38:06.727196+00:00 app[web.1]:
2021-05-13T08:38:09.716304+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.17.167.42/   
2021-05-13T08:38:09.716800+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2021-05-13T08:38:09.716935+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2021-05-13T08:38:09.717057+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2021-05-13T08:38:09.718069+00:00 app[web.1]: Starting the development server...
2021-05-13T08:38:09.718070+00:00 app[web.1]:
2021-05-13T08:38:09.756192+00:00 app[web.1]: events.js:353
2021-05-13T08:38:09.756194+00:00 app[web.1]: throw er; // Unhandled 'error' event
2021-05-13T08:38:09.756194+00:00 app[web.1]: ^
2021-05-13T08:38:09.756194+00:00 app[web.1]:
2021-05-13T08:38:09.756197+00:00 app[web.1]: Error: spawn xdg-open ENOENT
2021-05-13T08:38:09.756197+00:00 app[web.1]: at Process.ChildProcess._handle.onexit (internal/child_process.js:269:19)
2021-05-13T08:38:09.756200+00:00 app[web.1]: at onErrorNT (internal/child_process.js:467:16)        
2021-05-13T08:38:09.756200+00:00 app[web.1]: at processTicksAndRejections (internal/process/task_queues.js:82:21)
2021-05-13T08:38:09.756201+00:00 app[web.1]: Emitted 'error' event on ChildProcess instance at:     
2021-05-13T08:38:09.756201+00:00 app[web.1]: at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12)
2021-05-13T08:38:09.756201+00:00 app[web.1]: at onErrorNT (internal/child_process.js:467:16)        
2021-05-13T08:38:09.756202+00:00 app[web.1]: at processTicksAndRejections (internal/process/task_queues.js:82:21) {
2021-05-13T08:38:09.756202+00:00 app[web.1]: errno: -2,
2021-05-13T08:38:09.756202+00:00 app[web.1]: code: 'ENOENT',
2021-05-13T08:38:09.756203+00:00 app[web.1]: syscall: 'spawn xdg-open',
2021-05-13T08:38:09.756203+00:00 app[web.1]: path: 'xdg-open',
2021-05-13T08:38:09.756204+00:00 app[web.1]: spawnargs: [ 'http://localhost:50792' ]
2021-05-13T08:38:09.756204+00:00 app[web.1]: }
2021-05-13T08:38:09.782521+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2021-05-13T08:38:09.782832+00:00 app[web.1]: npm ERR! errno 1
2021-05-13T08:38:09.788616+00:00 app[web.1]: npm ERR! [email protected] start: `react-scripts start` 
2021-05-13T08:38:09.788720+00:00 app[web.1]: npm ERR! Exit status 1
2021-05-13T08:38:09.788846+00:00 app[web.1]: npm ERR!
2021-05-13T08:38:09.788944+00:00 app[web.1]: npm ERR! Failed at the [email protected] start script.  
2021-05-13T08:38:09.789016+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2021-05-13T08:38:09.793465+00:00 app[web.1]:
2021-05-13T08:38:09.793618+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:   
2021-05-13T08:38:09.793678+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2021-05-13T08_38_09_789Z-debug.log
2021-05-13T08:38:09.841562+00:00 heroku[web.1]: Process exited with status 1
2021-05-13T08:38:09.905305+00:00 heroku[web.1]: State changed from starting to crashed
2021-05-13T08:38:09.908595+00:00 heroku[web.1]: State changed from crashed to starting
2021-05-13T08:38:21.107935+00:00 heroku[web.1]: Starting process with command `npm start`
2021-05-13T08:38:24.965126+00:00 app[web.1]:
2021-05-13T08:38:24.965145+00:00 app[web.1]: > [email protected] start /app
2021-05-13T08:38:24.965146+00:00 app[web.1]: > react-scripts start
2021-05-13T08:38:24.965146+00:00 app[web.1]:
2021-05-13T08:38:28.024675+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.16.195.18/   
2021-05-13T08:38:28.024981+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2021-05-13T08:38:28.025126+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2021-05-13T08:38:28.025128+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2021-05-13T08:38:28.025747+00:00 app[web.1]: Starting the development server...
2021-05-13T08:38:28.025748+00:00 app[web.1]:
2021-05-13T08:38:28.064997+00:00 app[web.1]: events.js:353
2021-05-13T08:38:28.065000+00:00 app[web.1]: throw er; // Unhandled 'error' event
2021-05-13T08:38:28.065001+00:00 app[web.1]: ^
2021-05-13T08:38:28.065001+00:00 app[web.1]:
2021-05-13T08:38:28.065002+00:00 app[web.1]: Error: spawn xdg-open ENOENT
2021-05-13T08:38:28.065003+00:00 app[web.1]: at Process.ChildProcess._handle.onexit (internal/child_process.js:269:19)
2021-05-13T08:38:28.065003+00:00 app[web.1]: at onErrorNT (internal/child_process.js:467:16)        
2021-05-13T08:38:28.065004+00:00 app[web.1]: at processTicksAndRejections (internal/process/task_queues.js:82:21)
2021-05-13T08:38:28.065004+00:00 app[web.1]: Emitted 'error' event on ChildProcess instance at:     
2021-05-13T08:38:28.065005+00:00 app[web.1]: at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12)
2021-05-13T08:38:28.065005+00:00 app[web.1]: at onErrorNT (internal/child_process.js:467:16)        
2021-05-13T08:38:28.065005+00:00 app[web.1]: at processTicksAndRejections (internal/process/task_queues.js:82:21) {
2021-05-13T08:38:28.065006+00:00 app[web.1]: errno: -2,
2021-05-13T08:38:28.065006+00:00 app[web.1]: code: 'ENOENT',
2021-05-13T08:38:28.065006+00:00 app[web.1]: syscall: 'spawn xdg-open',
2021-05-13T08:38:28.065006+00:00 app[web.1]: path: 'xdg-open',
2021-05-13T08:38:28.065007+00:00 app[web.1]: spawnargs: [ 'http://localhost:11787' ]
2021-05-13T08:38:28.065007+00:00 app[web.1]: }
2021-05-13T08:38:28.094099+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2021-05-13T08:38:28.094508+00:00 app[web.1]: npm ERR! errno 1
2021-05-13T08:38:28.102975+00:00 app[web.1]: npm ERR! [email protected] start: `react-scripts start` 
2021-05-13T08:38:28.103358+00:00 app[web.1]: npm ERR!
2021-05-13T08:38:28.103494+00:00 app[web.1]: npm ERR! Failed at the [email protected] start script.  
2021-05-13T08:38:28.103631+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2021-05-13T08:38:28.114721+00:00 app[web.1]:
2021-05-13T08:38:28.114990+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:   
2021-05-13T08:38:28.115138+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2021-05-13T08_38_28_104Z-debug.log
2021-05-13T08:38:28.169652+00:00 heroku[web.1]: Process exited with status 1
2021-05-13T08:38:28.229144+00:00 heroku[web.1]: State changed from starting to crashed

the logs are above, can any one help me to solve this problem?

Cavdy · Accepted Answer · 2021-05-13 09:10:15Z

1

You should build a production version and serve it...

you can have a script like this

"start": "serve -s build",
"dev": "react-script start"

By default heroku will run the build script... Make sure to add serve as part of your dependencies

https://www.npmjs.com/package/serve

answered May 13, 2021 at 9:10

Cavdy

6189 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

have an error when deploy react app in heroku

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related