Szukaj…


Wprowadzenie

Tutaj dowiesz się, jak zacząć od angular-cli, generowania nowego komponentu / usługi / potoku / modułu z angular-cli, dodawania 3 party jak bootstrap, budowania projektu angular.

Utwórz pustą aplikację Angular2 za pomocą angular-cli


Wymagania:


Uruchom następujące polecenia z cmd z nowego folderu katalogu:

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

Otwórz przeglądarkę na localhost: 4200

Generowanie komponentów, dyrektyw, rur i usług

po prostu użyj polecenia cmd: Możesz użyć polecenia ng generuj (lub tylko ng), aby wygenerować komponenty kątowe:

  • Składnik: ng g component my-new-component
  • Dyrektywa: ng g directive my-new-directive
  • Pipe: ng g pipe my-new-pipe
  • Usługa: ng g service my-new-service
  • Class: ng g class my-new-classt
  • Interfejs: ng g interface my-new-interface
  • Enum: ng g enum my-new-enum
  • Module: ng g module my-module

Dodawanie bibliotek stron trzecich

W angular-cli.json możesz zmienić konfigurację aplikacji.

Jeśli chcesz dodać na przykład ng2-bootstrap:

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

  2. W angular-cli.json wystarczy dodać ścieżkę bootstrap w modułach węzłów.

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

buduj z angular-cli

W angular-cli.json na kluczu outDir możesz zdefiniować katalog kompilacji;

są równoważne

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

i takie też są

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

Podczas budowania możesz zmodyfikować base tag () w pliku index.html za pomocą opcji --base-href your-url.

Ustawia tag podstawowy href na / myUrl / w pliku index.html

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

Nowy projekt z scss / sass jako arkuszem stylów

Domyślne pliki stylów generowane i kompilowane przez @angular/cli to css .

Jeśli zamiast tego chcesz użyć scss , wygeneruj swój projekt za pomocą:

ng new project_name --style=scss

Jeśli chcesz użyć sass , wygeneruj swój projekt za pomocą:

ng new project_name --style=sass

Ustaw przędzę jako domyślny menedżer pakietów dla @ angular / cli

Przędza jest alternatywą dla npm, domyślnego menedżera pakietów na @ angular / cli. Jeśli chcesz użyć przędzy jako menedżera pakietów dla @ angular / cli, wykonaj następujące kroki:

Wymagania

Aby ustawić przędzę jako menedżera pakietów @ angular / cli:

ng set --global packageManager=yarn

Aby cofnąć npm jako menedżera pakietów angular / cli:

ng set --global packageManager=npm



Modified text is an extract of the original Stack Overflow Documentation
Licencjonowany na podstawie CC BY-SA 3.0
Nie związany z Stack Overflow