ng-輔助操做

建立組件，指令，過濾器和服務

# 建立組件
ng generate component my-new-component

# 建立組件別名
ng g component my-new-component # using the alias

# components support relative path generation
# if in the directory src/app/feature/ and you run
ng g component new-cmp
# your component will be generated in src/app/feature/new-cmp
# but if you were to run
ng g component ../newer-cmp
# your component will be generated in src/app/newer-cmp
# if in the directory src/app you can also run
ng g component feature/new-cmp
# and your component will be generated in src/app/feature/new-cmp

可輔助建立資源的功能列表：

Scaffold	Usage
Component	ng g component my-new-component
Directive	ng g directive my-new-directive
Pipe	ng g pipe my-new-pipe
Service	ng g service my-new-service
Class	ng g class my-new-class
Guard	ng g guard my-new-guard
Interface	ng g interface my-new-interface
Enum	ng g enum my-new-enum
Module	ng g module my-module

angular-cli will add reference to components, directives and pipes automatically in the app.module.ts. If you need to add this references to another custom module, follow this steps:

1. ng g module new-module to create a new module
2. call ng g component new-module/new-component

This should add the new component, directive or pipe reference to the new-module you've created.

在腳手架項目中使用 SASS 預處理器

SASS 是一款很是好用的 CSS 預編譯器，Bootstrap 官方從4.0開始已經切換到了 SASS。

若是想要在腳手架項目中使用 SASS 預處理器，咱們須要本身手動修改一些配置文件，請按照如下步驟依次修改：

• angular-cli.json 裏面的 styles.css 後綴改爲 .scss

當你後面再使用 ng g c *** 自動建立組件的時候，默認就會生成 .scss 後綴的樣式文件了。

• angular-cli.json 裏面的 styleExt 改爲 .scss

• src 下面 styles.css 改爲 styles.scss

• app.component.scss

• app.component.ts 裏面對應修改

改完以後，從新 ng serve，打開瀏覽器查看效果。

SASS 的 API 請參考官方網站 。

SASS 只是一個預編譯器，它支持全部 CSS 原生語法。利用 SASS 能夠提高你的 CSS 編碼效率，加強 CSS 代碼的可維護性，可是千萬不要幻想今後就能夠不用學習 CSS 基礎知識了。

更新 Angular CLI

其它

切換包管理器

# 默認爲 npm
ng set --global packageManager=npm

# 將包管理器設置爲 yarn
ng set --global packageManager=yarn

# 將包管理器設置爲 cnpm
ng set --global packageManager=cnpm

詳細參考文檔

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