13 Sep 2017

Proceso de actualización de Angular CLI para usar angular 4

En el artículo Angular CLI vimos como instalar el cliente de angular. Con la aparición de Angular 4, debemos actualizar esta instalación.

ATENCIÓN: Si utiliza CLI angular 1.0.0-beta.28 o menos, debe desinstalar el paquete angular-cli. Debe hacerse debido al cambio del nombre y del alcance del paquete de angular-cli a @angular/cli. Recuerde realizar las siguientes operaciones con perfil de administrador.

1. Desinstalar el paquete clásico de Angular CLI

npm uninstall -g angular-cli
npm uninstall --save-dev angular-cli

2. Desinstalar el paquete nuevo de Angular CLI (por si acaso)

npm uninstall -g @angular/cli

3. Vaciar la caché del gestor de paquetes npm

npm cache clean

4. Instalar la última versión de Angular CLI

Para actualizar Angular CLI a una nueva versión, debe actualizar tanto el paquete global como el paquete local de su proyecto.

Paquete global:
```
  npm install -g @angular/cli@latest
```

Paquete de proyectos locales:

  rm -rf node_modules dist 
  # use rmdir /S/Q node_modules dist in Windows Command Prompt; use rm -r -fo node_modules,dist in Windows PowerShell
  npm install --save-dev @angular/cli@latest
  npm install

5 . Probar que la instalación es correcta.

Generar un proyecto Angular 4

Ahora ya tenemos actualizado Angular CLI y ya podemos generar un nuevo proyecto de Angular 4

ng new mi-fabulosa-app

Lanzar el proyecto desde un servidor web

Angular CLI lleva integrado un servidor web, lo que quiere decir que podemos visualizar y usar el proyecto sin necesidad de cualquier otro software. Para servir la aplicación lanzamos el comando “serve”.

cd mi-fabulosa-app
ng serve

Eso lanzará el servidor web y lo pondrá en marcha.

Además, en el terminal verás como salida del comando la ruta donde el servidor está funcionando. Generalmente será algo como esto (pero te sugerimos verificar el puerto en la salida de tu terminal):

** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **

Referencias

https://github.com/angular/angular-cli

https://cli.angular.io/

Stats:

29 Aug 2023 0