So you are trying to debug the production build of your Angular app, you've run ng build --prod and you have your production files in your /dist folder but you can't quite seem to run the files locally.

Unfortunately there is no way to run ng serve --prod and serve the production build of your app locally. Here to save the day, the npm package: http-server.

http-server is a simple, zero-configuration command-line http server. It is powerful enough for production usage, but it's simple and hackable enough to be used for testing, local development, and learning.

When I last checked today (4/5/2021), the package had 3.1 million weekly downloads. This is a very popular npm package.

Download the http-server npm package

In the root directory of your Angular project, run the following command to download the http-server package:

npm install http-server -g

Build Your Angular App with the Production flag

Once the package downloads successfully, build your Angular project with the production flag using the following command:

ng build --prod

Your output/deployable files should now be in the /dist folder of your application. Your files may be outputted to a different folder depending on the value of the outputPath property in the angular.json file for your Angular app.

Serve Your Production App using the http-server Command

Serve your newly outputted production files locally using the following command: http-server dist/

Keep in mind that you may have to substitute dist/ with a different directory if the outputPath property in the angular.json file is different than the default of dist.

View the Production App Locally

If your http-server dist/ command was successful, you will see an output in your command line similar to this:

Starting up http-server, serving dist/
Available on:
  http://10.0.0.3:8080
  http://127.0.0.1:8080
Hit CTRL-C to stop the server

Navigate to either 10.0.0.3:8080 or 127.0.0.1:8080.

The production version of your Angular application will now be accessible on your local machine!

FeedbackI'd love to hear your feedback!
Did this blog post help fix your issue? Still having trouble?
Tweet At Me
Brendan SlukeSoftware Engineer

Hi, I'm Brendan Sluke and I love writing code and blogging about software engineering.

Follow Me On Twitter Read My Blog
Recommended Blog PostsBlog Posts I Think You Will Find Interesting
Go Back To Top of Page