Angular 2
Angular-cli

introduzione

Creare un'applicazione Angular2 vuota con angular-cli

Requisiti:

• NodeJS: pagina di download
• npm o filato

Esegui i seguenti comandi con cmd dalla nuova cartella di directory:

1. npm install -g @angular/cli o yarn global add @angular/cli
2. ng new PROJECT_NAME
3. cd PROJECT_NAME
4. ng serve

Apri il tuo browser su localhost: 4200

Generazione di componenti, direttive, condotte e servizi

usa semplicemente il tuo cmd: puoi usare il comando ng generate (o solo ng g) per generare componenti Angolari:

• Componente: ng g component my-new-component
• Direttiva: ng g directive my-new-directive
• Tubo: ng g pipe my-new-pipe
• Servizio: ng g service my-new-service
• Classe: ng g class my-new-classt
• Interfaccia: ng g interface my-new-interface
• Enum: ng g enum my-new-enum
• Modulo: ng g module my-module

Aggiunta di librerie di terze parti

In angular-cli.json puoi modificare la configurazione dell'app.

Se si desidera aggiungere ng2-bootstrap ad esempio:

1. npm install ng2-bootstrap --save o yarn add ng2-bootstrap

2. In angular-cli.json basta aggiungere il percorso del bootstrap su node-modules.

   "scripts": [
       "../node_modules/jquery/dist/jquery.js",
       "../node_modules/bootstrap/dist/js/bootstrap.js"
    ]
   

costruire con angular-cli

In angular-cli.json alla chiave outDir puoi definire la tua cartella di compilazione;

questi sono equivalenti

ng build --target=production --environment=prod
ng build --prod --env=prod
ng build --prod

e così sono questi

ng build --target=development --environment=dev
ng build --dev --e=dev
ng build --dev
ng build

Quando costruisci puoi modificare il tag di base () nel tuo index.html con l'opzione --base-href your-url.

Imposta il tag base href su / myUrl / nel tuo index.html

ng build --base-href /myUrl/
ng build --bh /myUrl/

Nuovo progetto con scss / sass come foglio di stile

I file di stile di default generati e compilati da @angular/cli sono css .

Se invece vuoi usare scss , genera il tuo progetto con:

ng new project_name --style=scss

Se vuoi usare sass , genera il tuo progetto con:

ng new project_name --style=sass

Imposta il filo come gestore pacchetti predefinito per @ angular / cli

Yarn è un'alternativa per npm, il gestore di pacchetti predefinito su @ angular / cli. Se si desidera utilizzare il filo come gestore pacchetti per @ angular / cli, attenersi alla seguente procedura:

Requisiti

• filato ( npm install --global yarn o vedi la pagina di installazione )
• @ npm install -g @angular/cli / cli ( npm install -g @angular/cli o yarn global add @angular/cli )

Per impostare il filato come @ angular / cli package manager:

ng set --global packageManager=yarn

Per ripristinare npm come @ angular / cli package manager:

ng set --global packageManager=npm