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 crear 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 la CLI de Angular utilizando 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 angular básico. Primero, muévase al directorio webroot de su servidor, luego inicialice una nueva aplicación Angular de la siguiente manera (recuerde seguir las indicaciones):

# 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 que pueda 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.