Deploying applications on Heroku is pretty straightforward in most cases. But I ran into a problem while deploying my NestJS application that included TypeScript.
The build succeeded but I kept running into 503 service unavailable error.
It took me a while to figure out the problem. Turns out we need some of the devDependencies in package.json for the app to run properly since we are performing the TypeScript build on the server.
To future me, here are the steps to deploy NestJS app, which includes TypeScript, to Heroku:
Sign up at Heroku or login if you already have an account set up.
Then you'll be redirected to a page where you have options to choose deployment methods. Clear instructions are provided in all of the available options.
I picked Github for convenience.
In your NestJs project folder, add an optional dynamic port since our web server will be assigned a dynamic port by Heroku and we cannot statically define the port through which our application will listen.
await app.listen(process.env.PORT || 3000);
If you use nest-cli to create your NestJS application, the package.json includes the following command that runs our app in production mode. And if not, add it manually:
"start:prod": "node dist/main.js"
Now, create a file called Procfile, without any file extension at the root of your project. Heroku uses the procfile to know the commands to start our application. Add the following in the file:
web: npm run start:prod
web: yarn start:prod
Now for the important step that I messed up. Heroku sets the
trueby default and installs production dependencies only.
To install devDependencies, set config vars
You can add/edit config vars using Heroku dashboard. The option is available under the app's settings tab.
Or as an alternative, heroku-cli can be used.
heroku config:set NPM_CONFIG_PRODUCTION=false
Edit: Not all devDependencies (like prettier, eslint) are required so it's preferable to move necessary dependencies for production from
Make sure to add the following in .gitignore file to exclude them from deploying to Heroku
Commit and push your changes to the remote repository. And, deploy your changes via any of the available integrations.
Either by using Heroku cli
git push heroku <branch_name>
Or using the Github deployment method from the Heroku dashboard
Top comments (17)
Great article, just wanted to point out that step 6 is not correct. That is what you would do if you didn't go through step 5. If you setup the Procfile to run start:prod you don't need development dependencies.
Thanks for the feedback !
Thanks a log :)
I am using it with fastify and I was required to add process.env.HOST to the listen too. Something like
I did not change the NPM_CONFIG_PRODUCTION flag but added required depenencies and was able to deploy successfully.
Great post! I was looking for a solution to this for way too long. Most tutorials say "just include /dist in the git repository" which really messes things up when trying to merge branches etc. :D
Thank you @nilsjansen :D I had to go through many resources to come to a solution. I thought it was just me.
Glad this helped you :)
Thanks for this
This was super handy! Thanks much
U help me Thanks !!
Thanks! this helped a lot.
Thanks dude! Great info!! Very Helpful @ @nilsjansen
In point 6 (devDependencies), what devDependencies were required (or should be moved to "dependencies")?
As far as I remember, for me they were dependencies like some of the typescript packages.
ayyyy thank you for this
Interesting! but how distinguish dev and prod environment??