簡介
關于"Angular"版本,"Angular"官方已經統(tǒng)一命名Angular 1.x同一為Angular JS,Angular 2.x及以上統(tǒng)稱"Angular"。
"CLI"是"Command Line Interface"的簡寫,是一種命令行接口,實現(xiàn)自動化開發(fā)流程。
比如:ionic-cli、vue-cli等;它可以創(chuàng)建項目、添加文件(組件,服務等)以及執(zhí)行一大堆開發(fā)任務,比如測試、打包和發(fā)布
下面就來給大家詳細介紹關于Angular4 Angular CLI的安裝與使用教程,需要的朋友可以參考借鑒,下面話不多說了,來一起看看詳細的介紹吧。
安裝Angular CLI
1. 需要安裝 nodejs 以及 npm
Node官網的地址:https://nodejs.org/en (詳細的安裝方法大家可以參考這篇文章://www.companysz.com/article/90518.htm)
2. 全局安裝 typescript,angular 推薦使用 typescript編寫(.ts 文件)。
Typescript 官網地址:http://www.typescriptlang.org/index.html
使用命令: npm install -g typescript
3. 安裝 angular-cli
Angular-cli 官網地址:https://cli.angular.io/
使用命令: npm install -g @angular/cli
圖示
注:因為安裝 angular-cli 的時間有點早了,不過大家安裝的時候不是我這個版本沒有關系的。
新建Angular項目
使用命令 new
// ngStudy 是工程名稱可以隨意修改的ng new ngStudy
項目圖示
注:需要等待漫長的時間,因為這個需要下載 node_modules,有 140多MB
生成的項目結構:
運行Angular項目
使用命令 serve
//需要進入工程的目錄中ng serve
運行圖示
界面訪問
寫在最后
1.安裝過程因為好多依賴包都是國外的,所以有可能下載不下來
1.1 可以嘗試修改 npm 的鏡像,改為淘寶的
1.2 通過 "藍燈" 代理去下載
2.關于項目的目錄結構可以去參考官方中文網的說明:https://angular.cn/guide/quickstart
3.命令行的使用地址:https://github.com/angular/angular-cli/wiki 貼上官方提供的常用命令的圖
4.介紹下更新 angular-cli 的版本方法
可以直接使用 npm install -g @angular/cli
進行更新
總結
以上就是這篇文章的全部內容了,希望本文的內容對大家的學習或者工作具有一定的參考學習價值,如果有疑問大家可以留言交流,謝謝大家對武林網的支持。
新聞熱點
疑難解答