How can I deploy my Angular 2 + Typescript + Webpack app
You are on the right track.....
Just install the nginx on your EC2. In my case I had a linux Ubuntu 14.04 installed on "Digital Ocean".
First I updated the apt-get package lists:
sudo apt-get update
Then install Nginx using apt-get:
sudo apt-get install nginx
Then open the default server block configuration file for editing:
sudo vi /etc/nginx/sites-available/default
Delete everything in this configuration file and paste the following content:
server { listen 80 default_server; root /path/dist-nginx; index index.html index.htm; server_name localhost; location / { try_files $uri $uri/ =404; }}
To make the changes active, restart the webserver nginx:
sudo service nginx restart
Then copy index.html and the bundle files to /path/dist-nginx
on your server and you are up and running.
If anyone still struggling with production setup of angular 2/4/5 app + 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 <base href="/">
in you index.html head tag.
Firstly, go to your angular repo (i.e. /home/user/helloWorld) path at your machine.
Then build /dist for your production server using the following command:
ng build --prod --base-href http://example.com:8080
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.
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. }}
Now restart nginx.
That's it !! Now you can access your angular app at http://example.com:8080
Hope it will be helpful.
A quicker way to deploy is as below:
1. Install nginx as mentioned by Herman.
2. Copy your dist/* files to /var/www/html/ without disturbing /etc/nginx/sites-available/default.
sudo cp /your/path/to/dist/* /var/www/html/
3. Restart nginx:
sudo systemctl restart nginx