Instalación de Angular CLI

npm i -g @angular/[email protected]

Creación de proyecto básico en Angular

Para iniciar un proyecto que contenga la seguridad del Template es necesario contar con la versión 16 de Angular, para validar que versión tienes instalada es necesario teclear en consola lo siguiente:

ng version

Se tendrá que mostrar en pantalla la versión de Angular CLI y tendrá que ser la 16 mas estable.

     _                      _                 ____ _     ___
    / \\   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|   / △ \\ | '_ \\ / _` | | | | |/ _` | '__|   | |   | |    | |  / ___ \\| | | | (_| | |_| | | (_| | |      | |___| |___ | | /_/   \\_\\_| |_|\\__, |\\__,_|_|\\__,_|_|       \\____|_____|___|                |___/Angular CLI: 16.2.0
Node: 16.16.0
Package Manager: npm 9.8.0
OS: darwin x64
Angular:...Package                      Version
------------------------------------------------------@angular-devkit/architect    0.1602.0 (cli-only)@angular-devkit/core         16.2.0 (cli-only)@angular-devkit/schematics   16.2.10 (cli-only)@schematics/angular          16.2.0 (cli-only)

Confirmando que tenemos la versión 16 mas estable, procedemos a crear el proyecto con el siguiente comando.

ng new nombre-de-la-aplicacion --style=scss --routing

Nota: El nombre de las aplicaciones debe ser escrito en minúsculas y separadas por un signo de menos (-) en caso de ser dos palabras. Agregamos el argumento –style=scss para indicarle que queremos usar scss en nuestro proyecto

Esto creará la plantilla base de Angular necesaria para trabajar e instalará todos las dependencias de npm.

CREATE nombre-de-la-aplicacion/README.md (1066 bytes)CREATE nombre-de-la-aplicacion/.editorconfig (274 bytes)CREATE nombre-de-la-aplicacion/.gitignore (604 bytes)CREATE nombre-de-la-aplicacion/angular.json (3309 bytes)CREATE nombre-de-la-aplicacion/package.json (1085 bytes)CREATE nombre-de-la-aplicacion/tsconfig.json (783 bytes)CREATE nombre-de-la-aplicacion/.browserslistrc (703 bytes)CREATE nombre-de-la-aplicacion/karma.conf.js (1440 bytes)CREATE nombre-de-la-aplicacion/tsconfig.app.json (287 bytes)CREATE nombre-de-la-aplicacion/tsconfig.spec.json (333 bytes)CREATE nombre-de-la-aplicacion/src/favicon.ico (948 bytes)CREATE nombre-de-la-aplicacion/src/index.html (306 bytes)CREATE nombre-de-la-aplicacion/src/main.ts (372 bytes)CREATE nombre-de-la-aplicacion/src/polyfills.ts (2820 bytes)CREATE nombre-de-la-aplicacion/src/styles.scss (80 bytes)CREATE nombre-de-la-aplicacion/src/test.ts (788 bytes)CREATE nombre-de-la-aplicacion/src/assets/.gitkeep (0 bytes)CREATE nombre-de-la-aplicacion/src/environments/environment.prod.ts (51 bytes)CREATE nombre-de-la-aplicacion/src/environments/environment.ts (658 bytes)CREATE nombre-de-la-aplicacion/src/app/app-routing.module.ts (245 bytes)CREATE nombre-de-la-aplicacion/src/app/app.module.ts (393 bytes)CREATE nombre-de-la-aplicacion/src/app/app.component.scss (0 bytes)CREATE nombre-de-la-aplicacion/src/app/app.component.html (24617 bytes)CREATE nombre-de-la-aplicacion/src/app/app.component.spec.ts (1124 bytes)CREATE nombre-de-la-aplicacion/src/app/app.component.ts (228 bytes)⠇ Installing packages (npm)...

Una vez finalice con la leyenda de Successfully initialized git. tendremos listo nuestra plantilla base de Angular 16 lista para hacer la instalación de nuestra plantilla de seguridad.