ng-cli搭建angular項目框架

原文地址

　　https://www.jianshu.com/p/0a8f4b0f29b3

環境準備

　　如下步驟都不須要事先建立文件夾，只是環境的準備過程，只有到須要搭建項目的時候才須要建立文件夾用來存放項目文件。

一、安裝NodeJs

　　NodeJs的安裝步驟是很簡單的，在網上下載一個一個nodeJs安裝包，而後按照提示一步一步的安裝。
　　NodeJs安裝好以後會連帶着安裝一個npm，nodeJs的安裝流程很簡單，按着步驟一步一步下來便可。
　　安裝完成以後在控制檯上輸入npm -v 以及 node -v若成功則會輸出對應版本，而且已經將npm和node部署到了全局的環境變量。

　　

二、安裝angulr-cli

方式一：ng-cli原生指令

npm install -g @angular/cli

方式二：該指令一樣能夠完成功能，可是會有一些奇怪的問題，好比ng eject的指令就不存在

npm install -g angular-cli

三、查看angular-cli版本，檢查是否安裝成功

ng -v

　　

搭建項目框架

四、新建項目

ng new Anuglar2Demo1 //以下圖則是項目建立成功的樣子

　

五、進入項目目錄

cd Anuglar2Demo1

六、啓動項目——執行ng serve命令

ng serve

七、訪問項目

　　訪問http://localhost:4200/

總結

　　以上的步驟都是我從網上各個博客中邊差邊寫的，而且本地根據上述的步驟也實現了好幾回的搭建簡單的angular項目的框架。固然有時候也可能由於nodejs的版本或者ng-cli的版本問題致使安裝的失敗，這時候不要着急，能夠嘗試着將版本下降或者從新搭建一次環境。利用ng-cli搭建angular看起來高大上，可是要搭建一個簡單基礎的項目框架，根據我上面的操做基本可以實現，可是一個全面的更加優秀的框架仍是須要不斷的完善才能夠的。

最後

　　這個是我已經搭建好的angular項目框架，若是不想花時間去搭建的能夠直接克隆我搭建好的就能夠使用了。

　　關於angular一些的實例應用中的angular-demo-base

　　//項目克隆以後，須要執行如下命令才能夠啓動項目 npm install npm run start

參考網址

使用 angular-cli 建立 angular2 項目
使用webStrom建立angular2項目
使用cnpm搭建項目