從安裝angular-cli,到使用angular-cli建立第一個項目


最近在學習angular2,由於國內想要安裝angular-cli的環境需要翻牆,在沒有梯子的情況下,翻牆顯得非常的蛋疼,自己也在坑里翻滾,掙扎,還好還是摸出了一條路

以下是windows 10環境下安裝angular-cli的過程,並且在安裝完成之后,使用angular-cli建立一個angular2的項目目錄

1、在node.js的官網下載node.js的安裝文件

最好下載的版本是windows系統(msi)64位這個,安裝簡單,自動裝好node和npm

安裝完成后使用命令提示符鍵入node -v查看node版本,最好是使用管理員模式

鍵入npm -v查看npm的版本,其實也是為了檢查你的node和npm是否安裝成功

確認上面兩個步驟可以查詢到系統的版本號之后,設置淘寶鏡像,有梯子的土豪當我沒說

npm install -g cnpm --registry=https://registry.npm.taobao.org

經過幾分鍾的等待,安裝好之后,使用cnpm安裝angular-cli

cnpm install –g @angular/cli

如果你之前安裝失敗過,最好在安裝angular-cli之前先卸載干凈,用以下兩句:

npm uninstall -g angular-cli
npm cache clean 

在檢查你全局的那些npm文件下還殘留下圖這兩個文件,有的話也要刪掉

接下來這一步,最好重啟下機器,被坑過,連轉好幾次,都以為沒安裝成功,結果試了下重啟,就是安裝成功了的

重啟機器后

使用命令提示符鍵入ng version查看angular-cli的版本同時檢測是否安裝成功

接下來是建立一個demo01的項目,因為是在國內的環境,所以構建第一個項目的時候,也是要借助cnpm

首先,在自已的文件夾內打開命令提示符,這樣也方便項目的管理(我是在一個angular-cli的文件夾內打開命令提示符的)

1、ng new demo01 --skip-install

加 --skip-install的原因是直接跳過下載,在下一步使用cnpm來下載

這一步驟完成之后相對應的文件夾會出現以上目錄,接着

cd demo01

cnpm install

等待cnpm下載完angular需要依賴的文件,接着最后一步,開啟服務

ng serve

 

顯示webpack:Compiled successfully之后,打開瀏覽器輸入localhost:4200就可以運行新建的angular2項目了

然而,這只是開端,接下來才開始正式和angular2交鋒!!!

angular-cli雖然簡單方便,幫你搭建好所需環境,但簡單方便的對立面是不靈活,多了很多我們可能不想用的包、文件,所以有能力搭建項目的,還是自己搭建吧


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM