Angular CLI 基本使用

安裝Angular-CLI

電腦上必須安裝Nodejs，才能安裝AngularCLI，
安裝NodeJs可至官網下載最新版本，更新NodeJs也是從官網下載最新版本即可

npm更新：

[sudo]npm install -g npm    //Linux環境可能要加上sudo

Angular CLI安裝

npm install -g @angular/cli

Angular CLI更新

[sudo] npm uninstall -g @angular/cli


npm cache clean

[sudo] npm install -g @angular/cli

建立Angular 專案

 ng new MyProjectName

啟動server

ng serve // 啟動server，會在本機上啟動，可以用瀏覽器開啟 http://localhost:4200檢視

建立component

建立一個Component元件，會自動在指令目錄下產生一個componentName資聊夾，並且建好對應Component檔案，在componentName前面也可以加上目錄相對路徑來指定產生檔案位置。

ng generate [path/]component componentName

同時這指令可以簡化為以下，g為generate縮寫，c則是component

ng g c [path/]componentName

透過上述方式，都會以component名稱在目錄下建立一個新的資料夾，如果要避免建立新資料夾，則可以加上--flat參數，這樣就會在目錄資料夾下直接建立component，並不會將component建立在新資料夾內。

ng g c [path/]componentName --flat

此外還有其他參數可以加上，像是--inline-template與--inline-style，
--inline-template表示建立component時，template的部分就會以inline-template的形式建立，就不會額外建立html檔，--inline-style亦是如此。

特別的是，這兩個參數可以簡化為 -it 與 -is 。

所以可以再建立component時輸入

ng g c [path/]componentName -it -is

建立directive

ng g d directiveName

程式部署

寫這麼多程式，真的要發佈出來時可以透過angular cli的build指令來將程式碼壓縮，成為少數幾個檔案，用來部署到客戶端server。

ng build --prod     建立要部署之程式

ng build --prod --aot    以AOT方式建立要部署之方式

ng build --prod --aot false  建立要部署之程式時，不使用AOT

這邊簡單記錄一下，目前使用Angular cli版本為1.2，在執行build --prod時，似乎預設會執行AOT，可能這時才會跑出一堆問題出來，所以才會衍生出第三個方式 ng build --prod --aot false，目的就是在建立部署程式時，不使用AOT執行。

目前學到這邊，其他等後續學到才陸續補上。

參考：angular-cli