Com executar aplicacions angulars mitjançant Angular CLI i PM2
Angular CLI és una interfície de línia d'ordres per a Angular framework, que s'utilitza per crear, construir i executar la vostra aplicació localment mentre es desenvolupa.
Està dissenyat per construir i provar un projecte Angular en un servidor de desenvolupament. Tanmateix, si voleu executar/mantenir les vostres aplicacions vives per sempre en producció, necessiteu un PM2.
PM2 és un gestor de processos de producció popular, avançat i ric en funcions per a aplicacions Node.js amb un equilibrador de càrrega integrat. El seu conjunt de funcions inclou suport per a la supervisió d'aplicacions, gestió eficient de microserveis/processos, execució del mode de clúster d'aplicacions i reinici i tancament elegant de les aplicacions. A més, admet una gestió fàcil dels registres d'aplicacions i molt més.
En aquest article, us mostrarem com executar aplicacions Angular mitjançant Angular CLI i el gestor de processos PM2 Node.js. Això us permet executar la vostra aplicació contínuament durant el desenvolupament.
Heu de tenir els paquets següents instal·lats al vostre servidor per continuar:
- Node.js i NPM
- CLI angular
- PM2
Nota: si ja teniu instal·lats Node.js i NPM al vostre sistema Linux, aneu al pas 2.
Pas 1: instal·lació de Node.js a Linux
Per instal·lar la darrera versió de Node.js, primer afegiu el dipòsit de NodeSource al vostre sistema tal com es mostra i instal·leu el paquet. No oblideu executar l'ordre correcte per a la versió de Node.js que voleu instal·lar a la vostra distribució Linux.
$ curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash - #for Node.js version 12 $ curl -sL https://deb.nodesource.com/setup_11.x | sudo -E bash - #for Node.js version 11 $ curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash - #for Node.js version 10 $ sudo apt install -y nodejs
# curl -sL https://deb.nodesource.com/setup_12.x | bash - #for Node.js version 12 # curl -sL https://deb.nodesource.com/setup_11.x | bash - #for Node.js version 11 # curl -sL https://deb.nodesource.com/setup_10.x | bash - #for Node.js version 10 # apt install -y nodejs
# curl -sL https://rpm.nodesource.com/setup_12.x | bash - #for Node.js version 12 # curl -sL https://rpm.nodesource.com/setup_11.x | bash - #for Node.js version 11 # curl -sL https://rpm.nodesource.com/setup_10.x | bash - #for Node.js version 10 # yum -y install nodejs # dnf -y install nodejs [On RHEL 8 and Fedora 22+ versions]
A més, també instal·leu eines de desenvolupament al vostre sistema perquè pugueu compilar i instal·lar complements natius des de NPM.
$ sudo apt install build-essential [On Debian/Ubuntu] # yum install gcc-c++ make [On CentOS/RHEL] # dnf install gcc-c++ make [On Fedora]
Un cop hàgiu instal·lat Node.js i NPM, podeu comprovar les seves versions mitjançant les ordres següents.
$ node -v $ npm -v
Pas 2: instal·lació d'Angular CLI i PM2
A continuació, instal·leu Angular CLI i PM2 mitjançant el gestor de paquets npm tal com es mostra. A les ordres següents, l'opció -g
significa instal·lar els paquets de manera global, utilitzable per tots els usuaris del sistema.
$ sudo npm install -g @angular/cli #install Angular CLI $ sudo npm install -g pm2 #install PM2
Pas 3: Creació d'un projecte angular amb Angular CLI
Ara aneu al directori webroot del vostre servidor i, a continuació, creeu, creeu i doneu servei a la vostra aplicació Angular (anomenada sysmon-app
, substituïu-la pel nom de la vostra aplicació) mitjançant Angular CLI.
$ cd /srv/www/htdocs/ $ sudo ng new sysmon-app #follow the prompts
A continuació, aneu al directori de l'aplicació (la ruta completa és /srv/www/htdocs/sysmon-app
) que s'acaba de crear i serveix a l'aplicació tal com es mostra.
$ cd sysmon-app $ sudo ng serve
Des de la sortida de l'ordre ng serve, podeu veure que l'aplicació Angular no s'executa en segon pla, ja no podeu accedir a l'indicador d'ordres. Per tant, no podeu executar cap altra ordre mentre s'està executant.
Per tant, necessiteu un gestor de processos per controlar i gestionar l'aplicació: executeu-la contínuament (per sempre) i també habiliteu-la per iniciar-se automàticament a l'arrencada del sistema, tal com s'explica a la secció següent.
Abans d'anar a la secció següent, finalitzeu el procés prement [Ctl + C]
per alliberar l'indicador d'ordres.
Pas 4: executar el projecte Angular per sempre utilitzant PM2
Per fer que la vostra nova aplicació s'executi en segon pla, alliberant l'indicador d'ordres, utilitzeu PM2 per servir-la, tal com es mostra. PM2 també ajuda a les tasques comunes d'administració del sistema, com ara reiniciar en cas d'error, aturar-se, tornar a carregar configuracions sense temps d'inactivitat i molt més.
$ pm2 start "ng serve" --name sysmon-app
A continuació, per accedir a la interfície web de la vostra aplicació, obriu un navegador i navegueu amb l'adreça http://localhost:4200
tal com es mostra a la captura de pantalla següent.
La pàgina d'inici de l'Angular CLI: https://angular.io/cli
Pàgina d'inici de PM2: http://pm2.keymetrics.io/
En aquesta guia, hem mostrat com executar aplicacions Angular mitjançant Angular CLI i el gestor de processos PM2. Si teniu alguna idea addicional per compartir o preguntes, poseu-vos en contacte amb nosaltres mitjançant el formulari de comentaris que trobareu a continuació.