Cómo instalar Angular CLI en Linux


Angular es un marco de desarrollo de aplicaciones front-end de código abierto, popular y altamente extensible, que se utiliza para crear aplicaciones móviles y web utilizando TypeScript/JavaScript y otros lenguajes comunes. Angular es un término general para todas las versiones de Angular que vienen después de AngularJS (o la versión 1.0 de Angular), incluidas Angular 2 y Angular 4.

Angular es ideal para construir aplicaciones de pequeña a gran escala desde cero. Uno de los componentes clave de la plataforma Angular para ayudar al desarrollo de aplicaciones es la utilidad Angular CLI: es una herramienta de línea de comandos simple y fácil de usar que se utiliza para crear, administrar, construir y probar aplicaciones Angular.

En este artículo, explicaremos cómo instalar la herramienta de línea de comandos Angular en un sistema Linux y aprenderemos algunos ejemplos básicos de esta herramienta.

Instalación de Node.js en Linux

Para instalar Angular CLI, debe tener la última versión de Node.js y NPM instalada en su sistema Linux.

$ sudo curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash - [for Node.js version 12]
$ sudo curl -sL https://deb.nodesource.com/setup_11.x | sudo -E bash - [for Node.js version 11]
$ sudo 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]

Además, para compilar e instalar complementos nativos de NPM, es posible que deba instalar herramientas de desarrollo en su sistema de la siguiente manera.

$ sudo apt install -y build-essential  [On Debian/Ubuntu]
# yum install gcc-c++ make             [On CentOS/RHEL]
# dnf install gcc-c++ make             [On RHEL 8/Fedora 22+]

Instalación de Angular CLI en Linux

Una vez que tenga Node.js y NPM instalados, como se muestra arriba, puede instalar Angular CLI usando el administrador de paquetes npm de la siguiente manera (el indicador -g significa instalar la herramienta en todo el sistema para ser utilizada por todos los usuarios del sistema).

# npm install -g @angular/cli
OR
$ sudo npm install -g @angular/cli

Puede iniciar Angular CLI usando el ejecutable ng que ahora debería estar instalado en su sistema. Ejecute el siguiente comando para verificar la versión de Angular CLI instalada.

# ng --version

Creando un Proyecto Angular usando Angular CLI

En esta sección, mostraremos cómo crear, construir y servir un nuevo proyecto básico de Angular. Primero, muévase al directorio webroot de su servidor, luego inicialice una nueva aplicación Angular de la siguiente manera (recuerde seguir las instrucciones):

# cd /var/www/html/
# ng new tecmint-app			#as root
OR
$ sudo ng new tecmint-app		#non-root user

A continuación, vaya al directorio de la aplicación que acaba de crear y sirva la aplicación como se muestra.

# cd tecmint-app
# ls 			#list project files
# ng serve

Antes de poder acceder a su nueva aplicación desde un navegador web, si tiene un servicio de firewall en ejecución, debe abrir el puerto 4200 en la configuración del firewall como se muestra.

---------- On CentOS/RHEL/Fedora ---------- 
# firewall-cmd --permanent --zone=public --add-port=4200/tcp 
# firewall-cmd --reload

---------- On Ubuntu/Debian ----------
$ sudo ufw allow 4200/tcp
$ sudo ufw reload

Ahora puede abrir un navegador web y navegar usando la siguiente dirección para ver cómo se ejecuta la nueva aplicación como se muestra en la siguiente captura de pantalla.

http://localhost:4200/ 
or 
http://SERVER_IP:4200 

Nota: Si usa el comando ng serve para construir una aplicación y servirla localmente, como se muestra arriba, el servidor reconstruye automáticamente la aplicación y recarga la (s) página (s) web cuando cambia cualquiera de las fuentes. archivos.

Para obtener más información sobre la herramienta ng, ejecute el siguiente comando.

# ng help

La página de inicio de Angular CLI: https://angular.io/cli

En este artículo, hemos mostrado cómo instalar Angular CLI en diferentes distribuciones de Linux. También cubrimos cómo construir, compilar y servidor una aplicación angular básica en un servidor de desarrollo. Para cualquier consulta o pensamiento que desee compartir con nosotros, utilice el formulario de comentarios a continuación.