nginx - app - ¿Cómo puedo implementar mi aplicación Angular 2+Typescript+Webpack?

angular nginx

Question

De hecho, estoy aprendiendo Angular 2 con Typescript y desarrollé una pequeña aplicación basada en el proyecto de semilla angular ( angular-seed ). He creado la aplicación para fines de producción y tengo la carpeta de distribución preparada para implementar con mis archivos de paquete como este:

dist/                    
  main.bundle.js              
  main.map         
  polyfills.bundle.js          
  polyfills.map            
  vendor.bundle.js         
  vendor.map

Sin embargo, como nuevo, no tengo idea de cómo implementarlo ahora en mi servidor EC2. Leí que tengo que configurar el servidor Nginx para que sirva mi archivo estático, pero ¿tengo que configurarlo para trabajar con mis archivos del paquete?

Disculpe mis errores, si los hubiera. ¡Muchas gracias por adelantado!

Answer 1

Estás en el camino correcto.....

Simplemente instale el nginx en su EC2. En mi caso, tenía un Linux Ubuntu 14.04 instalado en "Ocean Digital".

Primero actualicé las listas de paquetes apt-get:

sudo apt-get update

Luego instale Nginx usando apt-get:

sudo apt-get install nginx

A continuación, abra el archivo de configuración del bloque de servidor predeterminado para editarlo:

sudo vi /etc/nginx/sites-available/default

Elimine todo en este archivo de configuración y pegue el siguiente contenido:

server {
    listen 80 default_server;
    root /path/dist-nginx;
    index index.html index.htm;
    server_name localhost;
    location / {
        try_files $uri $uri/ =404;
    }
}   

Para activar los cambios, reinicie el servidor web nginx:

sudo service nginx restart

Luego, copie index.html y los archivos del paquete en /path/dist-nginx en su servidor y /path/dist-nginx en funcionamiento.

Answer 2

Estoy utilizando la CLI angular oficial para desplegarla en producción y es muy fácil de hacer. Puede implementarlo en la preproducción, es decir, o en la producción de esta manera:

ng build --env = pre --output-path = build / pre /

ng build --env = prod --output-path = build / prod /

Answer 3

Una forma más rápida de implementar es la siguiente:

1. Instale nginx como lo menciona Herman.
2. Copie sus archivos dist / * a / var / www / html / sin molestar / etc / nginx / sites-available / default.
sudo cp / your / path / to / dist / * / var / www / html /
3. Reinicie nginx:
sudo systemctl restart nginx