Read | Practice | Advance
Run the following command to generate the deployable files:
With Angular CLI
ng build –prod
With NPM
npm build –prod
For more you can visit https://angular.io/guide/deployment
You can download (as zip) the latest NGINX version from the site https://nginx.org/en/download.html.
After downloading the zip file, unzip it and keep to a directory. Now you need to update the configuration file to host the angular application.In the unzipped folder you will find the “nginx.conf” under “conf” directory. Open the file using any text editor and add the following lines inside the server section.
Consider that the dist location is “C:\angularapp\mayapp\dist” and the starting page is index.html. While defining the root, use forward slashes.
Server { Listen 80; Server_name localhost; .............. location / { root “C:/angularapp/myapp/dist”; try_files $uri $uri/ index.html; } .............. }
Considering that you have a service running at port 9000 starting with /api (http://localhost:9000/api/......). We need to configure the reverse proxy for the backend service as below.
Server { Listen 80; Server_name localhost; .......... location /api { proxy_pass http://localhost:9000; } .......... }
So the final changes would be
Server { Listen 80; Server_name localhost; .............. location / { root “C:/angularapp/myapp/dist”; try_files $uri $uri/ index.html; } location /api { proxy_pass http://localhost:9000; } .............. }
What happen if your API and your app are placed in the same location ?