-
ng? new??
ng generate
ng serve??
ng test?
ng build
angular CLI? ??
Amber CLI
webpack
查看全部 -
angular cli 學習筆記：
開發，組件，打包，測試
開發結構和運行結構
angular? cli 進行項目的構建
tips ： angular 2
? ? ? ??
查看全部 -
Angular 2簡介
????開發：效率
????運行：效果
功能簡介
????快速創建Angular 2項目及組件（new generate）
????使用Angular CLI能夠進行開發同步（serve）
????使用Angular CLI簡單進行測試和打包（test build）
查看全部 -
ng new my-app //創建項目
ng new my-app --skip-install //阻止npm安裝
cd my-app
ng serve
查看全部 -
cnpm install -g @angular/cli
查看全部 -
angular2 中的組件 new generate？怎么使用
查看全部 -
使用淘寶鏡像安裝Angular CLI
補充：其實不需要，只需要設置鏡像源npm就可以了npm config set registry https://registry.npm.taobao.org，然后還是用npm安裝。
查看全部 -
項目構建步驟
查看全部 -
Angular2 項目構建及運行過程
1、安裝npm，git等
2、創建angular2項目? ? ng? new? ?my-app
3、在項目中添加Component 或者 Service? ng g component/service
4、編譯并運行? ng? serve --port 4201
5、單元測試 ng test
6、打包發布：ng build? --prod? --aot
知識點：
1、Angular CLI 基于Amber和Webpack，是Angular2的標準構建工具
? ? Amber的構建能力：目錄結構、模塊關系等的創建
? ? Webpack的調試、測試、打包能力
2、Angular2項目文件作用
????--packgae.json? ?包含所有應用的類庫
????--angular.json? ? 配置編譯過程中使用的路徑，依賴關系，圖標樣式、環境信息等
????--e2e? 測試目錄
????--node-module 依賴庫的位置
????--src? 實際項目目錄
3、Angular2項目的入口數據走向
入口文件是：main.ts
它調用了app/app.module中的AppModule
由此啟動第一個組件AppComponment
4、Ng build 優化
1、預編譯技術? ?--aot
????壓縮了Angular框架代碼，將需要解釋--執行的代碼，變為可以直接執行的代碼，實現按需加載，達到優化的目的
2、生產模式
????ng build 默認是在開發模式下打包代碼，有大量的Debug開關，開發調試，打印輸出等不必要的代碼；
????生成模式去掉冗余代碼，合并公用文件，減少了請求的次數和體積，提高效率；使用哈希碼標記文件，減少由CDN更新引發的引用錯誤；并壓縮文件，從而達到優化目的。
查看全部 -
ls -alh dist/ 查看 dist 目錄里面的文件類型
du -h? dist/? 查看 dist 目錄的里面的文件的大小
ng build --prod? 最終打包上線? 【去掉一些dubug】
1. 代碼打包：ng bulid
2. 壓縮優化瀏覽器代碼打包命令：ng build --aot
3. 去除各種測試優化的打包命令：ng bulid -prod
查看全部 -
ng test 單元測試
測試文件(xxx.spec.ts)
在頁面顯示測試結果分析
查看全部 -
ng generate
（1）創建組件
ng generate component test
實際上創建了組件的模版文件（html）、樣式文件（css）、
測試文件（spec.ts）、ts文件，并且更新了模塊文件，將組件
添加到模塊中（實際上是在里面聲明組件）。
（2）創建服務
ng generate service test -m app.module
注冊到app.module里面
實際上創建了服務的測試文件（spec.ts）、ts文件，
并且更新了模塊文件，將服務添加到模塊中（實際上是
在里面聲明服務）。
查看全部 -
改變端口號：ng serve --port 4201
查看全部 -
前者花費時間太久，改良后
查看全部 -
普通創建項目
(1)創建my-app項目
ng new my-app?
(2)進入文件夾cd my-app
(3)啟動運行ng服務
ng serve
查看全部 -
項目的構建
查看全部 -
1111111
查看全部 -
改變端口號：ng serve --port 4201
查看全部 -
Ng new 簡介
參數分類：
????開發輔助（--dry-run）
????修改項目默認值（--prefix）
展示ng的所有命令：ng help
進入目錄某一文件夾下查看其內容：vim 文件路徑。win下沒有這個命令，安裝個git即可解決此問題。
查看全部 -
操作步驟1：
????ng new my-app(項目名稱)
????cd my-app
????ng serve
操作步驟2：
????ng new my-app --skip-install
????cd my-app
????cnpm install
????ng serve
此課程的編輯器是Atom。
查看全部 -
安裝步驟：cnpm install -g @angular/cli.
若是想安裝某個版本的話：npm install -g @angular/[email protected]
查看是否安裝成功：ng version，若安裝成功的話，會顯示angular的版本、node的版本、操作系統的版本。
查看全部 -
安裝國內淘寶鏡像：npm install -g cnpm --registry=https://registry.npm.taobao.org
查看全部 -
ls -alh dist/ 查看 dist 目錄里面的文件類型
du -h? dist/? 查看 dist 目錄的里面的文件的大小
ng build --prod? 最終打包上線? 【去掉一些dubug】
查看全部
舉報