[轉]【Angular4】基礎（一）：腳手架 Angular CLI

本文轉自：https://blog.csdn.net/u013451157/article/details/79444495

版權聲明：本文爲博主原創文章，未經博主容許不得轉載。 https://blog.csdn.net/u013451157/article/details/79444495

首先介紹一下@angular/cli腳手架的使用。

快速安裝

npm install -g @angular/cli

• 1

建立新項目

ng new angular-demo

• 1

啓動項目

ng serve

• 1

還能夠加上參數：

ng serve --open

• 1

使用 –open（或-o） 參數能夠自動打開瀏覽器並訪問http://localhost:4200/

若是想改變端口號，有兩種方法：

1）在命令行中輸入ng serve --port 4201

2）在 node_modules 中搜索 schema.json 並打開，找到 serve>port 後修改其中的 default 值便可 
 
固然~

啓動項目除了用 ng serve 外還能夠用 npm start

若是用這種方式的話更改端口也能夠這樣配置，改變」start」對應的值： 

新建組件

ng generate component component-name

• 1

也可縮寫爲：

ng g c component-name

• 1

下面是一些命令的縮寫：

g —— generate           生成
c —— class 類 d —— directive 指令 m —— module 模塊 p —— pipe 管道 s —— service 服務 it —— inline-template 內聯模板 is —— inline-style 內聯樣式

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8

啓動測試

ng test

• 1

編譯項目

ng build

• 1

---

更新 angular-cli（Angular2 升級到 Angular4 歷程）

隨着 Angular 升級到版本 4， angular-cli 也進入了 1.0 正式版。因此咱們須要先更新 angular-cli 的版本。 首先須要刪除舊的 angular-cli，若是你的 angular-cli 是在 beta-28 以前的版本，須要在工程目錄下執行下面的命令：

npm uninstall -g angular-cli npm uninstall --save-dev angular-cli

• 1
• 2

angular-cli 在 beta-28 以後改了包名，併入 @angular 的子項目，包名改爲了 @angular/cli，因此若是是 beta-28 以後的版本，請執行下面的命令刪除:

npm uninstall -g @angular/cli npm uninstall --save-dev @angular/cli

• 1
• 2

而後咱們須要安裝新的 @angular/cli，但進行以前須要清理一下緩存：

npm cache clean npm install -g @angular/cli@latest