Marco web

Cómo instalar Angular CLI en Ubuntu 22.04

Cómo instalar Angular CLI en Ubuntu 22.04

Angular CLI es una herramienta poderosa que permite a los desarrolladores crear e implementar rápidamente aplicaciones angulares. Proporciona una serie de comandos para crear e implementar rápidamente aplicaciones basadas en NG. También cubriremos algunas de las características de Angular CLI. Las características de la CLI angular incluyen:

  • Creación de nuevos proyectos con diferentes plantillas
  • Trabajar con archivos y activos
  • Construcción de proyectos para la producción
  • Generación de andamios de código

En esta publicación de blog, le mostraremos cómo instalar Angular CLI en Ubuntu 22.04. Empecemos!

Paso 1 - Instalación del nodo.js

Nodo.JS es el requisito principal para ejecutar aplicaciones angulares. Puede instalar el nodo requerido.JS usando la utilidad de línea de comandos NVM. Inicie sesión en su sistema Ubuntu y siga:

  1. Use el siguiente comando para instalar NVM:
    curl https: // raw.githubusercontent.com/creationix/nvm/master/install.sh | intento
  2. Ahora active el NVM Enviornemnt en su sistema.
    fuente ~/.bashrc
  3. A partir de hoy, Angular 14 es la última versión que Suport Node.JS 14 LTS y 16 VERSIONES LTS. El siguiente comando instalará el nodo.JS 16 en tu sistema.
    NVM Instalar v16
  4. El siguiente comando mostrará la versión de Node y NPM instalada en su sistema.
    nodo -v npm -v

Paso 2 - Instalación de CLI angular

Después de instalar el nodo.JS y NPM En su sistema, use los siguientes comandos para instalar la herramienta Angular CLI en su sistema.

NPM install @angular/cli --location = global
Instalación de la CLI angular en Ubuntu 22.04

La última versión de Angular CLI se instalará en su sistema Ubuntu Linux.

Puede necesitar una versión angular más antigua en su máquina. Para instalar el comando específico de la versión angular de ejecución como lo siguiente con el número de versión.

NPM instalación -g @angular/[correo electrónico protegido]10 #Angular 10 NPM instalación -g @angular/[correo electrónico protegido]11 #Angular 11 NPM instalación -g @angular/[correo electrónico protegido]12 #Angular 12

Uso del comando -g arriba instalará la herramienta CLI angular globalmente. Por lo tanto, será accesible para todos los usuarios y aplicaciones en el sistema. Angular CLI proporciona un comando ng utilizado para operaciones de línea de comandos. Verifiquemos la versión instalada de NG en su sistema.

versión ng
Verifique la versión angular instalada

La interfaz de línea de comandos angular se ha instalado en su sistema. Para la aplicación existente, puede iniciar su trabajo e ignorar el artículo del resto.

Siga los siguientes pasos para crear una nueva aplicación angular en su sistema.

Paso 3: crear una nueva aplicación angular

Puede usar el comando ng para crear una nueva aplicación angular. Crear aplicación llamada Hello-World usando la herramienta de línea de comandos Angular. Ejecutar el siguiente comando en la terminal:

ng nuevo hello-world 
Vale ? ¿Le gustaría agregar enrutamiento angular?? Sí ? ¿Qué formato de hoja de estilo te gustaría usar?? CSS Crear Hello-World/Readme.MD (1064 bytes) Crear hello-world/.EditorConfig (274 bytes) Crear Hello-World/.Gitignore (548 bytes) Crear Hello-World/Angular.JSON (2947 bytes) Crear hello-world/paquete.JSON (1042 bytes) Crear hello-world/tsconfig.JSON (863 bytes) Crea Hello-World/.Browserslistrc (600 bytes) Crear Hello-World/Karma.confusión.JS (1428 bytes) Crear Hello-World/Tsconfig.aplicación.JSON (287 bytes) Crear hello-world/tsconfig.Especificaciones.JSON (333 bytes) Crea Hello-World/.VScode/Extensiones.JSON (130 bytes) Crea Hello-World/.VSCODE/LANZAR.JSON (474 ​​bytes) Crea Hello-World/.Vscode/tareas.JSON (938 bytes) Crea Hello-World/Src/Favicon.ICO (948 bytes) Crea Hello-World/SRC/Index.HTML (296 bytes) Crear hello-world/src/main.TS (372 bytes) Crear hello-world/src/polyfills.TS (2338 bytes) Crea Hello-World/Src/Styles.CSS (80 bytes) Crear hello-world/src/test.TS (749 bytes) Crea Hello-World/Src/Assets/.Gitkeep (0 bytes) Crear hello-world/src/entornos/entorno.pinchar.TS (51 bytes) Crear hello-world/src/entornos/entorno.TS (658 bytes) Crear hello-world/src/app/app-ruting.módulo.TS (245 bytes) Crear Hello-World/Src/App/App.módulo.TS (393 bytes) Crear Hello-World/Src/App/App.componente.CSS (0 bytes) Crear Hello-World/Src/App/App.componente.HTML (23364 bytes) Crear hello-world/src/app/app.componente.Especificaciones.TS (1088 bytes) Crear hello-world/src/app/app.componente.TS (215 bytes) ✔ Paquetes instalados correctamente.

Esto creará un directorio llamado Hello-World en su directorio actual y creará todos los archivos requeridos para una aplicación angular.

Paso 4 - Servir la aplicación angular

Su aplicación angular básica está lista para servir. Cambie al directorio Hello-World y luego ejecute su aplicación angular usando el comando ng servidor.

CD Hello-World Servir

Por defecto, la aplicación angular se ejecuta en el puerto 4200. Puede acceder a su sistema en el puerto 4200 para abrir la aplicación angular, como:

  • http: // localhost: 4200

Puede cambiar el host y el puerto para ejecutar la aplicación angular proporcionando argumentos de línea de comandos -host y de puerto.

Ng Servir -Host 0.0.0.0 -Port 3001

Usando la dirección de host 0.0.0.0 permite que la aplicación escuche en todas las interfaces y es de acceso público.

Conclusión

En conclusión, este artículo le ha mostrado cómo instalar la CLI angular en Ubuntu 22.04. Este tutorial también te ayudó a crear una nueva aplicación angular. Ahora, visite aquí para configurar la aplicación angular detrás del servidor Apache. Si se encuentra con algún problema o tiene alguna pregunta, deje un comentario a continuación y haré todo lo posible para ayudarlo. Gracias por leer!.