how to deploy angular2 app built using angular-cli

Question

I have created n new angular app using angular-cli.

I completed the app and preview it using ng-serve, it is working perfectly.

After that I used ng build --

Answer 1

If anyone is working with Nginx, then here is the complete solution:

Suppose you want to deploy your angular app at HOST: http://example.com and PORT: 8080 Note - HOST and PORT might be different in your case.

Make sure you have in you index.html head tag.

1. Firstly, go to your angular repo (i.e. /home/user/helloWorld) path at your machine.

2. Then build /dist for your production server using the following command:

   ng build --prod --base-href http://example.com:8080

3. Now copy /dist (i.e. /home/user/helloWorld/dist) folder from your machine's angular repo to the remote machine where you want to host your production server.

4. Now login to your remote server and add following nginx server configuration.

   server {
   
       listen 8080;
   
       server_name http://example.com;
   
       root /path/to/your/dist/location;
   
       # eg. root /home/admin/helloWorld/dist
   
       index index.html index.htm;
   
       location / {
   
           try_files $uri $uri/ /index.html;
   
           # This will allow you to refresh page in your angular app. Which will not give error 404.
   
       }
   
   }
   

5. Now restart nginx.

6. That's it !! Now you can access your angular app at http://example.com:8080

Hope it will be helpful.