How to run the Dist Folder on Local Machine in Angular 6+?

Solution 1:

You can do that using http-server package.

First install the package globally

npm install http-server -g

Then inside your project directory(in the terminal) just run

http-server dist/

And if you are using Angular 6+ or above (Working with Angular 10), You have to run

http-server dist/your-project-name

Now you can visit http://localhost:8080 to view your application

Solution 2:

In my case I did next:

Install http-server globally

npm install http-server -g

Then inside the project directory (in the terminal), I run

http-server dist/[your-project-name]

Now you can visit http://localhost:8080/index.html to view your application. But when I restart the browser page I have to add again /index.html into URL.

It works in Angular 7.x.x version.

Solution 3:

Edit: Angular 12+: ng serve --configuration production

Since Angular 7 you can just do ng serve --prod=true. Documentation: https://angular.io/cli/serve

I know the question asks about Angular 6 but Google got me here, so just for future reference.

Solution 4:

From Terminal:
$ npm install http-server -g

From Angular Project Dir. Lets say your Angular project name is ngx.
$ ng build
$ http-server dist/ngx
Starting up http-server, serving dist/ngx
Available on:
http://127.0.0.1:8080
http://192.168.43.54:8080
Hit CTRL-C to stop the server

Enjoy!