Programming is bittersweet.
It is very tedious and many a time, it can leave developers very frustrated with little zeal for another keypress.
However, developers are always having a whale of a time while coding, and they are full of pride and joy, once all their codes run successfully without errors.
That being said no one wants to be frustrated while coding hence no one wants bugs in their codes.
Developers, often do not get it all right ("code-wise") at first try; consequently, the software development cycle involves debugging, refactoring, upgrading, and many other enhancement operations.
In addition, developers know that many a time we all have to deal with bugs in our code. Hence debugging is an invaluable skill in a developer's repertoire. And to be successful at debugging, we need a good understanding of error messages.
Error codes or messages are the ways computers inform us that there are bugs in our codes, and sometimes it tells us where they are.
The paradox is that error codes; although are very helpful, they are not plain English and can be very confusing and cryptic
Below are error codes from a crashed app on Heroku.
2019-10-11T11:27:28.019054+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=realtylabapp.herokuapp.com request_id=74165d9f-db2a-46bd-ab9c-1a01403bd00f fwd="129.205.113.108" dyno= connect= service= status=503 bytes= protocol=https
2019-10-11T11:27:29.919409+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=realtylabapp.herokuapp.com request_id=fa48efa2-4ddf-41e6-a633-a62cb02314bd fwd="129.205.113.108" dyno= connect= service= status=503 bytes= protocol=https
Heroku uses a unique alphanumeric error code combo to communicate to the developer the kind of error that was found in their code.
This alphanumeric error code ranges from:
-
H10toH99 -
R10toR99 -
L10toL15
Get a detailed list here: Complete Heroku Error Codes
This article is focused on the Heroku H10-App crashed error code which is thrown when an application crashes on Heroku. This is as much as it goes. It does not help us with the reason our app crashed and that's where this article comes in. Below are some causes of this error and I guarantee you that some of them would surprise you greatly!
Bug in Procfile
A very interesting discovery for me. A bug in your Procfile can crash your app. If your Procfile is pointing to the wrong server file. e.g If your server is in server.js and your Procfile points to app.js this would definitely crash your app and Heroku would greet you with the H10-App crashed error code message.
Secondly, a buggy Procfile can also come in the form of wrong spacing. e.g
Wrong: web : node index.js
Correct web: node index.jsSetting a PORT as a Heroku environment variable
This would surely crash your app. Heroku automatically sets a Port that can be accessed viaprocess.env.PORT. Setting a port yourself would crash your app. Surprisingly, the commandheroku configdoes not display the preset Heroku port so one might be tempted to set another port as an environment variable.
To see all the preset Heroku environment variables, use the commandheroku run printenv.Missing Required Environment Variable while setting a port would cause this error because Heroku already sets a port internally, failing to set any required environment variable (e.g your database), would prompt Heroku to greet you with this error.
Missing Required Scripts
This error is thrown in a Node.js environment if you forget to set astart script. Heroku uses this script to start your app so if it is missing, it would throw anH10-App crashederror code message.
This can be solved by setting a start script in the package.json. e.g
"scripts": {
"start": "node index.js"
}
Final Thoughts
If none of the above solved your problem, you can make a last-ditch attempt by updating all your packages. If this doesn't help and you are in a Node.js environment, your last resort would be setting a node version in the engine section of your package.json file.
{
"name": "myapp",
"description": "a really cool app",
"version": "1.0.0",
"engines": {
"node": "12.11.1"
}
}
The Unthinkable
Lastly, if your bug defiles all solution, and by this time you are grasping at straws; I leave you in the able hands of heroku restart.
Let me know if you have experienced any other cause of this error in the comment below.
Top comments (128)
Up until recently I was able to deploy development build to Heroku and since couple of days ago even out-of-the-box npx create-react-app would fail with H10 code - solution was to ofc deploy the production build like below:
npm install serve --s
"scripts": {
"dev": "react-scripts start",
"start": "serve -s build",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"heroku-postbuild": "npm run build"
}
Looks like i picked a bad time to attempt to deploy my first web app. Does this mean I need to run this line in my command module "npm install serve --s"
and then copy this into my package.json exactly as is?
"scripts": {
"dev": "react-scripts start",
"start": "serve -s build",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"heroku-postbuild": "npm run build"
}
I tried to do that and it didn't work when I went to update the master on heroku.
Thanks in advance...
As of May 23rd, 2020. This fix worked beautifully. I've never had any issues pushing to heroku until my most recent project. This was perhaps my 4th or 5th attempt to fix it and this work amazingly. Thanks DaleLuce
Works like a charm
Thanks for this it was helpful
@daleluce Thank you so much thank uuuu!! i spent all the day to fix this problem i tied so many solution on internet but only your solution worked!! i was give up but you saved me, i made the account now to thank you <3
Thanks for letting me know Mohamed! This made my day!
Thank you!. This worked!
yes!!! Thank you so much!! yes yes yes yes
Worked like a charm after 2 days of frustration! Thank you!!!
I made this app without authentication and there was no problem deploying it on heroku but now I have added authentication to it and heroku is creating trouble. Looks like I am gonna stuck here for weeks.
24-Aug-2020 : I tried this fix and this worked for me ,
1.) "npm install serve --s" in my terminal
"scripts": {
"dev": "react-scripts start",
"start": "serve -s build",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"heroku-postbuild": "npm run build"
}
2.) copied the above code("scripts") in place of my previous code "scripts" in my package.json file
3.) git commit -am "new update"
4.) git push heroku master
and Boom I found my wesite on herokuapp
thank you very much
Pros BR's de plantão, isso aqui ainda funciona, fiz aqui no meu e meu deploy deu certo, caso esteja assim no seu,
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
use o npm install serve --s e altere igual ao comentário a cima.
THAT STILL WORKS ON 30/01/2020
It works for me thank you very much !!!
Thank you for providing this steps, It also worked for me
Thank you.This worked for me
This worked like magic! Thank you so much!
THANK YOU!!! i created this account just to thank you because I had so so much trouble deploying. Build was fine but after build when heroku tried to run start, I ran into so many H10 and H12 errors and the app can't even display a static page.
Your solution worked PERFECTLY!
Thanks. It solved my problem on Heroku, but I can't run my app locally.
After installing serve and modifying package.json, when I run npm start - serve says the app is available on port 5000 but I'm getting 404 page there. (it doesn't work also on port 3000 which was the one that I used so far).
Any ideas why?
Hi Haim,
If you run yarn start/npm start now it points to 'serve -s build' instead of 'react-scripts start'.
Make sure you've added below:
"dev": "react-scripts start",
"start": "serve -s build",
and to run your app locally do npm run dev not npm start
Thanks. It didn't work with "npm dev" (I got that "dev" is invalid command), but it did work with "npm run dev".
I am glad to hear this worked for you.
Just a side note:
commands like
npm startcan work directly because they are default commands from npm but custom commands likedevset by the user would only work with theruncommand.npm run dev. I hope this clears things up.Thanks a lot, now deploy on Heroku is working! But I've found another issue. Changing from npm start to serve -s build the local solution (npm run dev) is the correct one but the one on Heroku is not the same (is something like the first beninning project template). Why this difference? I've tried with a npm run build command but no difference. Thank you
Thanks. You saved me a lot of time and trouble.
This worked!!
Thanks dude.
Thank you very much. Now it serves like a charm.
This was a lifesaver. Thanks!
Thanks a lot!
Finally! it worked!! Thank you so much!!!!
Really thank you Very Much you saved my Wasted Time with installing serve and calling it on start script
Hero!!! Thank you!
Thank You !!!
This worked ...Thanks for saving a day's work
Thank you soooo much!!!! this worked!!! ater 2 days of being stucked!!!!
Wow.. this worked like a charm.
Thanks my brother....
Greetings from Argentina Corrientes
I have no idea why, but install serve --s solved the issue!!! Why is that??
I have many other older react apps running normally on heroku without needing to install serve --s
Thank you sooo much! This sure saved me a lot of frustration. Was wondering if you could give a bit of insight about how you figured out this solution
If you look at the logs it says 'starting development server' - given that if we deploy something to heroku we want it to be prod environment for variety of reasons (stackoverflow.com/questions/481511...). I looked at the versions of react and it so happened that react itself was upped a version 2-3 days prior to my attempt to deploy so I realized that whatever heroku was doing before to serve the build server obv somehow broke so I decided to change it to prod build (which I should have done from the get go but never cared as I just wanted to send the app to friends)
I spent many hours troubleshooting and this ended up working. Thank you!!
The same occurred with me. Thanks for this solution.
I am glad this helped you resolve your issue.
Same happened to me. Do you know why this is happening?
We can only speculate, React was updated on March 20th and around then it stopped working so I am guessing there is something that is happening with webpack or whatever was successfully serving our apps.
Thank you!!! This solved it
It worked for me, thanks a lot !
Programming is bittersweet indeed!!!
Thanks for publishing this article... I wanted to get my hands dirty by building a graphql server and deploy it online. After the headaches writing resolvers, I finally had a final working version ready for deployment. My search led me to Heroku and I deployed in minutes. With only one command away I typed
heroku openwaiting for the magic to happen only to see "Heroku H10-App Crashed Error".Never-giving-up, I came this far and nothing will stop me. I came across you article and I figured Number 2 was my cause...
See me doing some energetic dance moves here :-)
thanks so much.... very grateful
Glad to hear you resolved your isssue.
Hi everyone, i was running on the same problem of H10 and H20 errors. The app was working fine (package.json "start" declared correctly, no Proclife needed) on my goorm IDE container, no errors (using mongo Atlas - cloud Database), and runing on the local port 3000. But every time I tried to deploy it in heroku it was constantly giving back these annoying errors.
Then I checked some threads on stack overflow and found the solution here
stackoverflow.com/questions/186796...
My app listening on port 3000 like this.
//app.listen(3000, function () {
// console.log("Yelp Camp Server running on Port 3000")
// });
I thought it was fine but then i tried writing it in some other way i found in the answers of that thread.
app.listen(process.env.PORT || 3000, function() {
console.log('Server listening on port 3000');
});
AND THIS SOLVED MY PROBLEM. I actually couldn't find why it wasn't working correctly on heroku (because it worked fine on my local environment), but I'm so glad its running ok now.
Hope my solution can help someone.
You rock!!!!
It was my issue too!!!! :D
Thank you so much! That helped fixed the error I was getting!
I got the same H10 app crashed but none of the above solutions worked for me. I have updated build back using this command it worked after that.
heroku buildpacks:set mars/create-react-app
It happened again and this time, Number 2 wasn't the cause as I have already resolved that. I tried to run it locally and found out that, I made a typo in my code and it was crashing my app.
so I think you should add that to the checklist.
Glad to add this to the list parables
Hello Parables could you be more specific about what the typo was? I am very happy to update my list.
Thanks.
Thankyou so much man .I was searching for the solution for past 3 days.I m new to this and was stuck .My Procfile had an indentation problem and this quickly solved my prblem.
PS: Created an account here just to thank you.
Ran into same error message. app was deploying successfully but not opening.
Issue was I had .env as a soft link to a file outside the working folder (Ubuntu)
restored the actual file and it started working.
Somehow, if a file is needed by Heroku and it's a soft link and not the actual file, it breaks the app.
Something to keep an eye on in future.
Okay, am back again on how to check your app for errors. In my previous case, it was a wrong import or a typo(better use Typescript to avoid these small typos) that was causing my app to crash locally.Fixing that solved it for both localhost and Heroku. But I was here again today because of the H10 error. It seems your article has now become my checklist whenever a deploying to Heroku. so to add a few tips:
heroku local -a <heroku-app-name>. Make sure you test everything to make sure nothing crasheshost: process.env.HOST || '0.0.0.0' || 'localhost'That was why I was here today: I switched from Express to Hapi (just curiosity sake) only to meet this H10 error again. After lot of hours and multiple tabs of StackOverflow answers, I went to the Slack community of Hapi to seek help. It was then that I found out I needed step 3 above so make community support your last option before you even think of giving up
Regarding Procfile, web: node index.js should be ok as you can see in the official documentation devcenter.heroku.com/articles/gett...
Btw, good advice is to test your app locally before deploying because errors are much more readable, so run heroku local web to check out if everything is ok then deploy.
Thanks for this pro tip.
Woooo! It's June 08, 2021 and this article keeps on giving. It worked for me! Thank so much.
Followed this exactly,
"scripts": {
"dev": "react-scripts start",
"start": "serve -s build",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"heroku-postbuild": "npm run build"
}
(start with npm run dev to run it locally )
2.) copied the above code("scripts") in place of my previous code "scripts" in my package.json file
3.) git commit -am "new update"
4.) git push heroku master
Thanks Kaitlyn Rodriguez.
"
e.g
Wrong: web : node index.js
Correct web:node index.js
"
actually....
correct: web: node yourEntryFile.js
I was diagnosing an h10 error when I stumbled upon this post. Lots of great information, but a small error in the post sent me on a wild goose chase! In the above excerpt the wrong and correct syntax are actually reversed. the correct syntax in your Procfile should be web: node server.js server.js is just what I named my entry point and is not mandatory. What is, however, is the space between the colon and node.
I have found out that my original problem was incorrect imports between my components leading to the original h10 error. When I tried to fix it I changed my Procfile to the "correct" way mention in this post. Then later also fixed my imports. With the error still persisting I used Uros Randelovic's solution. Surprise, it worked! However, this solution was only masking the fact that in an attempt to fixed the h10 due to other issues, I changed my Procfile incorrectly to not include a space, then Uros Randelovic's solution circumvented the fact that Heroku didn't know how to start my file with a misconfigured Procfile and used the older syntax in the package.json file to correctly launch the app.
In summary if your Profile, captial P also import has web: node server.js ...or whatever filename you want to name your entry point, and a package.json file that looks like this for you scripts section...
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
Heroku automagically looks for "build" now. Make sure you heroku config:set your env vars from CLI
eg. heroku config:set KEY=VALUE examples of KEY=VALUE pairs would be your database config, secret key for auth, etc.. and finally properly configure the JS in your entry point. In this example my entry is server.js with the following important code
const express = require("express");
const path = require("path");
const favicon = require("serve-favicon");
const logger = require("morgan");
require("dotenv").config();
require("./config/database");
const app = express();
app.use(logger("dev"));
app.use(express.json());
app.use(favicon(path.join(dirname, "build", "favicon.ico")));
app.use(express.static(path.join(dirname, "build")));
app.use("/api/users", require("./routes/api/users"));
app.get("/*", function (req, res) {
res.sendFile(path.join(__dirname, "build", "index.html"));
});
const port = process.env.PORT || 3001;
app.listen(port, function () {
console.log(
express app running on port ${port});});
make sure you require and install important modules, config your env and database, properly assign your port variable for either production or development and configure your server to return your index.html from the build folder when given any path.
I was getting same error for a react app templated by create-react-app.
I resolved it by changing buildpack to github.com/mars/create-react-app-b... .
Above build pack is required for create-react-app template (static sites).
In Heroku dashboard, under settings> buildpack - I changed from node build pack to github.com/mars/create-react-app-b... and then react static web page started working (buildpack can be set via Heroku CLI also).
If your app is involving, node backend , then checkout github.com/mars/heroku-cra-node .
I just solved this problem in my app and I consider it a big win
process.env.PORT👍heroku restartmultiple times and it turned out great.This is my second time using heroku but my first time connecting it to a database.
I made a to-do list and it's URL is @ todo-list-234.herokuapp.com/
THANKS FOR YOUR HELP!
hi i am getting below error ,eventhough i verified everything.
heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=sleepy-basin-67900.herokuapp.com request_id=f0e633ca-b51e-4b81-9d2f-11857b8d4e42 fwd="157.50.221.204" dyno= connect= service= status=503 bytes= protocol=https
I found the solution add another buildpack with this:
heroku buildpacks:set mars/create-react-app
without it, my app doens't worked?
Hi Robson,
Not sure what this command is but it worked for me, can see the app on screen at last (still errors) but on screen. Thanx!
Thanks a lot Robson for sharing this. Just worked for me after hours of near frustration
I have had the same problem. So, I coudn't find the solution yet.
I've struggled for hours, but finally have figured out, that I run my app from dist/server.j, but dist folder was ignored in .gitignore file, thus has been never pushed to Heroku. You can check your published files by running heroku run bash -a [APP_NAME]