Deploying Next.js Project to Heroku Failure - reactjs

I'm trying to Deploy my next.js project on heroku but on the app run, it fails and this is the log of the failure.
2019-11-17T18:23:33.067077+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=pens-nextjs.herokuapp.com request_id=f01abc4b-bf9b-4f2e-8b8e-06184580bfc8 fwd="41.232.85.202" dyno= connect= service= status=503 bytes= protocol=https
2019-11-17T18:23:37.203987+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=pens-nextjs.herokuapp.com request_id=f4f94391-c79c-4503-9751-fe8a6c5461d3 fwd="41.232.85.202" dyno= connect= service= status=503 bytes= protocol=https
2019-11-17T18:23:38.045712+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=pens-nextjs.herokuapp.com request_id=98cc2b80-5631-4af1-9889-26abecca6aec fwd="41.232.85.202" dyno= connect= service= status=503 bytes= protocol=https

I was also facing the same issue.
I added favicon.ico in public folder of my NextJs App. Also, add following lines in your package.json
"scripts": {
"dev": "next",
"build": "next build",
"start": "next start -p $PORT",
"heroku-postbuild": "npm run build",
"test": "echo \"Error: no test specified\" && exit 1"
},
Hope this works for you!

Next.js binds to port 3000 by default, while Heroku expects your server process to bind to the port supplied in the PORT environment variable. You can make the Next.js server to bind to this port by modifying package.json to have "start": "next start -p $PORT".

Related

Deploying react app on heroku causes errors of code=H13 and code=H12

I am trying to deploy react app where backend is laravel and deployed on heroku as well.
In logs I get this:
at=error code=H12 desc="Request timeout" method=GET path="/" host=travelim-app.herokuapp.com request_id=ee5254ae-dec8-4b0b-b21c-afb673790d26 fwd="78.57.239.91" dyno=web.1 connect=0ms service=30000ms status=503 bytes=0 protocol=https
at=error code=H12 desc="Request timeout" method=GET path="/favicon.ico" host=travelim-app.herokuapp.com request_id=3f6d3553-53d7-4c41-b4ef-56233a81c752 fwd="78.57.239.91" dyno=web.1 connect=5000ms service=30001ms status=503 bytes=0 protocol=https
at=error code=H13 desc="Connection closed without response" method=GET path="/favicon.ico" host=travelim-app.herokuapp.com request_id=da3d0002-2425-40b1-8c34-019cfecdaa31 fwd="78.57.239.91" dyno=web.1 connect=0ms service=11805ms status=503 bytes=0 protocol=https
Attaching photo as well:
Logs
And my packege.json file scripts part:
scripts
If more info needed, feel free to ask!

Heorku Application Open Failure

I am trying to deploy me react app on Heroku. Everything says deployed on Heroku but when I type Heroku open, it says application error and the winddow suggests to do Heroku --tail. When I do Heroku --tail on command line, I receive the following error:
State changed from starting to crashed
2020-05-31T21:02:37.775855+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=ancient-gorge-48530.herokuapp.com request_id=d9a3fe26-753e-417d-b296-b77f9ea48280 fwd="24.105.211.206" dyno= connect= service= status=503 bytes= protocol=https
2020-05-31T21:02:39.965317+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=ancient-gorge-48530.herokuapp.com request_id=b767e1b3-d89d-4cf1-b762-aa7ca6b06496 fwd="24.105.211.206" dyno= connect= service= status=503 bytes= protocol=https
2020-05-31T21:02:47.963754+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=ancient-gorge-48530.herokuapp.com request_id=252ba8b0-1413-4762-8f9e-866f4ce263dc fwd="24.105.211.206" dyno= connect= service= status=503 bytes= protocol=https
2020-05-31T21:02:48.946628+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=ancient-gorge-48530.herokuapp.com request_id=ec439c87-bbdd-4880-a3e9-f93911527f1f fwd="24.105.211.206" dyno= connect= service= status=503 bytes= protocol=https
2020-05-31T21:03:34.544211+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=ancient-gorge-48530.herokuapp.com request_id=0d845c3c-198e-48a0-b8ed-225a89af5af0 fwd="24.105.211.206" dyno= connect= service= status=503 bytes= protocol=https
2020-05-31T21:03:36.818111+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=ancient-gorge-48530.herokuapp.com request_id=d179d8d0-da44-4353-99d3-776cb60fa7a4 fwd="24.105.211.206" dyno= connect= service= status=503 bytes= protocol=https
The problem usually comes from Procfile, make sure your Procfile was properly set up

React App deploying but not running in heroku

Thank you in advance for any help with this issue, i have been trying to solve it for some hours now...
I have created a react app with create-react-app and it's running fine in the local server, deployed it to heroku and it deployed sucessfully, but it does not open.
When i do heroku logs --tail i get the bellow errors:
2020-04-23T15:32:00.547380+00:00 app[web.1]: ℹ 「wds」: Project is running at http://172.16.17.130/
2020-04-23T15:32:00.547959+00:00 app[web.1]: ℹ 「wds」: webpack output is served from
2020-04-23T15:32:00.548051+00:00 app[web.1]: ℹ 「wds」: Content not from webpack is served from /app/public
2020-04-23T15:32:00.548120+00:00 app[web.1]: ℹ 「wds」: 404s will fallback to /
2020-04-23T15:32:00.548312+00:00 app[web.1]: Starting the development server...
2020-04-23T15:32:00.548312+00:00 app[web.1]:
2020-04-23T15:32:00.680072+00:00 heroku[web.1]: State changed from starting to crashed
2020-04-23T15:32:01.946329+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=portfolio-carlosamorim.herokuapp.com request_id=3c71f08a-4492-40b7-bb6c-82055d05f0bd fwd="89.153.213.119" dyno= connect= service= status=503 bytes= protocol=https
2020-04-23T15:32:02.587450+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=portfolio-carlosamorim.herokuapp.com request_id=3a20431f-789e-4da8-a151-438205b055e9 fwd="89.153.213.119" dyno= connect= service= status=503 bytes= protocol=https
2020-04-23T15:33:23.144950+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=portfolio-carlosamorim.herokuapp.com request_id=d043557d-ed3f-474a-ba84-0d14c2ac2696 fwd="89.153.213.119" dyno= connect= service= status=503 bytes= protocol=https
2020-04-23T15:33:23.414482+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=portfolio-carlosamorim.herokuapp.com request_id=f612d864-2e2e-4669-a33d-9b5edb23732d fwd="89.153.213.119" dyno= connect= service= status=503 bytes= protocol=https
My package.json :
https://github.com/CarlosAmorimProjects/portfolio/blob/master/package.json
Anyone experienced and solved the same issue ?
Thank you
Update :
I was able to deploy it and it's running at Vercel.com, i used buildpack create-react-app and it's working perfectly, i cannot apply that same builpack on heroku.
I suspect the problem is related to that.
The default buildpack when deploying is that of node.js. You needed to use the create-react-app buildpack (as seen below).
heroku create $APP_NAME --buildpack mars/create-react-app
git push heroku master
heroku open
helpfull link: https://dev.to/webdevraj/deploy-a-react-app-on-heroku-the-right-way-5efo

React app working locally but application error when deployed to heroku

I've been using Heroku from a long time and it was working fine. Now without any environment change, heroku is not working for me anymore. My app is working perfectly fine locally but when i deploy it on heroku it gives Application Error. Then i created a new app and without doing any changes i deployed this new app on heroku. It gave the exactly same error which means problem is not with my app, it's either with heroku or the way i'm deploying the app.
I use create react app and i'm adding package.json file and log file below. Please help me. I'm trying to figure it out from past two days :(
Thanks in advance for you help!
package.json
{
"name": "react-pustepause",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.3.2",
"#testing-library/user-event": "^7.1.2",
"antd": "^4.0.4",
"axios": "^0.19.2",
"react-responsive": "^8.0.3",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"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
2020-04-04T20:49:10.777143+00:00 app[web.1]: Starting the development server...
2020-04-04T20:49:10.777144+00:00 app[web.1]:
2020-04-04T20:49:10.847784+00:00 heroku[web.1]: State changed from starting to crashed
2020-04-04T20:49:11.613758+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-pustepause.herokuapp.com request_id=7f19caf3-ade4-4360-a31a-32b8d90cc110 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T20:49:12.382387+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-pustepause.herokuapp.com request_id=6a97a9e4-7aa1-479e-82d1-e268800693af fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T20:49:15.020120+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-pustepause.herokuapp.com request_id=c1b63c14-c058-4020-8e50-7e4db85a0616 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T20:49:15.349808+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-pustepause.herokuapp.com request_id=70152859-a3b8-48fb-af05-a6c7c77293b4 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T20:49:16.521253+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-pustepause.herokuapp.com request_id=fb1c9753-5225-476a-a168-42ec7e9f34cf fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T20:49:16.835390+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-pustepause.herokuapp.com request_id=abc45209-4f20-4171-ac93-71734680e95f fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T20:49:17.120246+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-pustepause.herokuapp.com request_id=4f4b7fd9-642a-4424-905e-d79af7a7fb38 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T20:49:17.460808+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-pustepause.herokuapp.com request_id=3a66e08a-3530-418c-a019-385506016dfc fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T20:49:17.737342+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-pustepause.herokuapp.com request_id=70d194a1-42a2-4842-ae86-1c72418629f3 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T20:49:18.045515+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-pustepause.herokuapp.com request_id=07689863-02d0-4b7f-b58a-3f04b8bb60f5 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T20:49:18.472033+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-pustepause.herokuapp.com request_id=a9ae0dfc-deb4-48e5-a4ea-ccbb25e89467 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T20:49:18.785185+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-pustepause.herokuapp.com request_id=c826cda1-cf1f-4d54-b434-215db33b4127 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-04T21:10:13.785015+00:00 heroku[web.1]: State changed from crashed to starting
2020-04-04T21:10:25.359246+00:00 app[web.1]:
2020-04-04T21:10:25.359259+00:00 app[web.1]: > react-pustepause#0.1.0 start /app
2020-04-04T21:10:25.359260+00:00 app[web.1]: > react-scripts start
2020-04-04T21:10:25.359260+00:00 app[web.1]:
2020-04-04T21:10:27.456512+00:00 app[web.1]: ℹ 「wds」: Project is running at http://172.18.161.114/
2020-04-04T21:10:27.456873+00:00 app[web.1]: ℹ 「wds」: webpack output is served from
2020-04-04T21:10:27.456958+00:00 app[web.1]: ℹ 「wds」: Content not from webpack is served from /app/public
2020-04-04T21:10:27.457014+00:00 app[web.1]: ℹ 「wds」: 404s will fallback to /
2020-04-04T21:10:27.457209+00:00 app[web.1]: Starting the development server...
2020-04-04T21:10:27.457211+00:00 app[web.1]:
2020-04-04T21:10:27.588035+00:00 heroku[web.1]: State changed from starting to crashed
2020-04-04T21:55:26.797837+00:00 heroku[web.1]: State changed from crashed to starting
2020-04-04T21:55:40.204461+00:00 app[web.1]:
2020-04-04T21:55:40.204479+00:00 app[web.1]: > react-pustepause#0.1.0 start /app
2020-04-04T21:55:40.204479+00:00 app[web.1]: > react-scripts start
2020-04-04T21:55:40.204480+00:00 app[web.1]:
2020-04-04T21:55:42.853119+00:00 app[web.1]: ℹ 「wds」: Project is running at http://172.18.206.246/
2020-04-04T21:55:42.853546+00:00 app[web.1]: ℹ 「wds」: webpack output is served from
2020-04-04T21:55:42.853636+00:00 app[web.1]: ℹ 「wds」: Content not from webpack is served from /app/public
2020-04-04T21:55:42.853716+00:00 app[web.1]: ℹ 「wds」: 404s will fallback to /
2020-04-04T21:55:42.853902+00:00 app[web.1]: Starting the development server...
2020-04-04T21:55:42.853903+00:00 app[web.1]:
2020-04-04T21:55:42.976144+00:00 heroku[web.1]: State changed from starting to crashed
2020-04-04T23:16:55.576000+00:00 heroku[web.1]: State changed from crashed to starting
2020-04-04T23:17:12.455408+00:00 app[web.1]:
2020-04-04T23:17:12.455433+00:00 app[web.1]: > react-pustepause#0.1.0 start /app
2020-04-04T23:17:12.455434+00:00 app[web.1]: > react-scripts start
2020-04-04T23:17:12.455434+00:00 app[web.1]:
2020-04-04T23:17:15.775689+00:00 app[web.1]: ℹ 「wds」: Project is running at http://172.16.24.26/
2020-04-04T23:17:15.776953+00:00 app[web.1]: ℹ 「wds」: webpack output is served from
2020-04-04T23:17:15.777103+00:00 app[web.1]: ℹ 「wds」: Content not from webpack is served from /app/public
2020-04-04T23:17:15.778644+00:00 app[web.1]: ℹ 「wds」: 404s will fallback to /
2020-04-04T23:17:15.778983+00:00 app[web.1]: Starting the development server...
2020-04-04T23:17:15.778983+00:00 app[web.1]:
2020-04-04T23:17:15.929319+00:00 heroku[web.1]: State changed from starting to crashed
2020-04-05T02:06:59.424136+00:00 heroku[web.1]: State changed from crashed to starting
2020-04-05T02:07:14.025754+00:00 app[web.1]:
2020-04-05T02:07:14.025777+00:00 app[web.1]: > react-pustepause#0.1.0 start /app
2020-04-05T02:07:14.025778+00:00 app[web.1]: > react-scripts start
2020-04-05T02:07:14.025778+00:00 app[web.1]:
2020-04-05T02:07:16.714076+00:00 app[web.1]: ℹ 「wds」: Project is running at http://172.17.224.6/
2020-04-05T02:07:16.714521+00:00 app[web.1]: ℹ 「wds」: webpack output is served from
2020-04-05T02:07:16.714621+00:00 app[web.1]: ℹ 「wds」: Content not from webpack is served from /app/public
2020-04-05T02:07:16.714721+00:00 app[web.1]: ℹ 「wds」: 404s will fallback to /
2020-04-05T02:07:16.714918+00:00 app[web.1]: Starting the development server...
2020-04-05T02:07:16.714920+00:00 app[web.1]:
2020-04-05T02:07:16.825861+00:00 heroku[web.1]: State changed from starting to crashed
2020-04-05T07:48:27.405222+00:00 heroku[web.1]: State changed from crashed to starting
2020-04-05T07:48:39.670311+00:00 app[web.1]:
2020-04-05T07:48:39.670333+00:00 app[web.1]: > react-pustepause#0.1.0 start /app
2020-04-05T07:48:39.670334+00:00 app[web.1]: > react-scripts start
2020-04-05T07:48:39.670334+00:00 app[web.1]:
2020-04-05T07:48:41.805354+00:00 app[web.1]: ℹ 「wds」: Project is running at http://172.16.55.206/
2020-04-05T07:48:41.805768+00:00 app[web.1]: ℹ 「wds」: webpack output is served from
2020-04-05T07:48:41.805879+00:00 app[web.1]: ℹ 「wds」: Content not from webpack is served from /app/public
2020-04-05T07:48:41.805963+00:00 app[web.1]: ℹ 「wds」: 404s will fallback to /
2020-04-05T07:48:41.806163+00:00 app[web.1]: Starting the development server...
2020-04-05T07:48:41.806164+00:00 app[web.1]:
2020-04-05T07:48:41.888875+00:00 heroku[web.1]: State changed from starting to crashed
2020-04-05T13:32:28.861883+00:00 heroku[web.1]: State changed from crashed to starting
2020-04-05T13:32:42.139952+00:00 app[web.1]:
2020-04-05T13:32:42.139968+00:00 app[web.1]: > react-pustepause#0.1.0 start /app
2020-04-05T13:32:42.139968+00:00 app[web.1]: > react-scripts start
2020-04-05T13:32:42.139968+00:00 app[web.1]:
2020-04-05T13:32:44.072413+00:00 app[web.1]: ℹ 「wds」: Project is running at http://172.16.108.126/
2020-04-05T13:32:44.072765+00:00 app[web.1]: ℹ 「wds」: webpack output is served from
2020-04-05T13:32:44.072839+00:00 app[web.1]: ℹ 「wds」: Content not from webpack is served from /app/public
2020-04-05T13:32:44.072900+00:00 app[web.1]: ℹ 「wds」: 404s will fallback to /
2020-04-05T13:32:44.073069+00:00 app[web.1]: Starting the development server...
2020-04-05T13:32:44.073070+00:00 app[web.1]:
2020-04-05T13:32:44.147851+00:00 heroku[web.1]: State changed from starting to crashed
2020-04-05T18:30:30.954173+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-pustepause.herokuapp.com request_id=9bbecd3c-355f-44cf-b416-fcc895e00977 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-05T18:30:32.056816+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-pustepause.herokuapp.com request_id=206fb2f9-125d-4b3b-b2b4-82350d98207f fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-05T18:38:16.519444+00:00 app[api]: Starting process with command `rake db:migrate` by user khzainulabidin#gmail.com
2020-04-05T18:38:31.243571+00:00 heroku[run.8227]: State changed from starting to up
2020-04-05T18:38:36.579921+00:00 heroku[run.8227]: State changed from up to complete
2020-04-05T18:38:43.791939+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-pustepause.herokuapp.com request_id=4576ce30-2005-4545-b84a-8847ba4e5133 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-05T18:38:44.110647+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-pustepause.herokuapp.com request_id=95628db1-c532-48e6-b9d5-6b587536c8f7 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-05T18:38:45.089377+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-pustepause.herokuapp.com request_id=5da35fd7-1d62-4acc-aed9-4ab8d53f2084 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-05T18:38:45.550772+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-pustepause.herokuapp.com request_id=7f632320-be75-4034-8702-b537e23bc38a fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-05T18:38:45.974139+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-pustepause.herokuapp.com request_id=bcf72176-4100-4a8a-80f6-4e94c6ec5b00 fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-05T18:38:46.324445+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-pustepause.herokuapp.com request_id=07824287-ee32-4870-b3db-af0e44082a2b fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-05T18:38:46.877015+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=react-pustepause.herokuapp.com request_id=41432fd5-89a2-4ab8-94de-4a90ecc48ecc fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
2020-04-05T18:38:47.217088+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=react-pustepause.herokuapp.com request_id=a6a4826e-a3dd-4810-900e-0f1ba718f9af fwd="68.192.253.24" dyno= connect= service= status=503 bytes= protocol=https
So I finally found the solution. This is because of the buildpack used by Heroku. Heroku used to use 'Create React App' build pack but now it uses 'nodejs' buildpack as default, even for static react apps too. So here's the method to fix this:
If you already have deployed your app on heroku and want to fix
Login to Heroku Web
Go to Settings
Under Buildpacks, click Add buildpack
Copy and paste this url: https://buildpack-registry.s3.amazonaws.com/buildpacks/mars/create-react-app.tgz
Click Save Changes
Now deploy your app again (do any little changes and push the updates, don't push exactly same code as before) and new buildpack will do it's work
Your app is ready to use!
If you haven't deployed your app or if you want to do this through command line
Use the following command to fix the issue:
heroku create $APP_NAME --buildpack mars/create-react-app
git push heroku master
Change $APP_NAME with your actual app name.
Hope that helped!

React project hosted in heroku fails when open

So deployed a React project to heroku using bitbucket pipelines that is working well, but now can't seem to make heroku to open the project don't have the script npm start in my package.json and what is recommend is to create a file Procfile that is a txt and inside have
web: index.html
in my webpack:
entry: {
bundle: './src/index.js'
},
output: {
publicPath : '/',
path: path.resolve(__dirname,'build'),
filename: '[name].[chunkhash].js'
},
and in package.json
"scripts": {
"heroku-prebuild": "npm install --only=dev",
"clean": "rimraf build",
"build": "npm run clean && webpack -p",
"serve": "webpack-dev-server --progress --colors"
},
in the heroku logs getting:
heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/"
host=projectname.herokuapp.com
request_id=a2bc33da-f938-4d7b-9395-b40442f9b2c0 fwd="88.157.88.35"
dyno= connect= service= status=503 bytes= protocol=https
heroku[router]: at=error code=H10 desc="App crashed" method=GET
path="/favicon.ico" host=projectname.herokuapp.com
request_id=b2de2bdf-528e-4f97-9fe9-7f313e025ebd fwd="88.157.88.35"
dyno= connect= service= status=503 bytes= protocol=https
Not using the create-react-app and if possible didn't want to add node express to point to the react project https://blog.bitsrc.io/react-production-deployment-part-3-heroku-316319744885
So do I need to point to build/index.html in Procfile?? or is it some other way all the examples have seen are about create-react-app and node express....
Was able to find the solution in the following blog where as stated the heroku runs by default npm start command if the Procfile is missing or add in the Procfile the line web: npm start and as stated in the blog the start command in package.json runs serve -s build where the serve is a package to point the build folder where is located the bundle and the index.html file and now it already works well. Heroku should have a default option to point to a default folder.. but all attemps that had tried failed... so thanks for #Bernard Bado and his blog for pointing to the solution.

Resources