1、全域性安裝angular cli
由於用npm安裝比較慢，先安裝**映象cnpm，可參考之前的文章：
然後使用命令進行安裝：cnpm install -g @angular/cli，其中-g表示全域性安裝
2、檢視是否安裝成功
命令：ng version
操作1: 命令如下，比較慢
//操作2：命令如下，比較快，建議該安裝進入專案目錄下
ng serve
cnpm
install
ng serve
這裡用cnpm安裝要比npm快
上面兩步分別是yes和回車
稍微等一下，結束後執行ng serve
編譯成功
通過以上**，可以訪問如下的頁面
專案目錄如下：
該.ts檔案又指明了輸出的html模板和css，可以去相關路徑檢視
html中的title引用的就是.ts檔案中定義的title，修改一下儲存後瀏覽器可以直接改變
html中
瀏覽器已改變
1、構建component
ng g component test
元件的名稱為
再次ng serve編譯後在瀏覽器中可看到
對應的是test.component.html
2、構建service
ng g service test或ng g s test
具體配置可參考：
修改testservice
編譯，在瀏覽器訪問，控制台有輸出
即被呼叫了。
3、測試
ng test
主要是看 .spec.ts 檔案
4、打包：
ng build
優化 ng build --aot 這樣能夠精簡打包出來的大小，把一些不必須的東西去除
ng build -prod 生產環境，打包之後，檔案很小。
Angular CLI學習整理
angular cli 是乙個命令列介面 command line inte ce 用於實現自動化開發工作流程。它允許你做以下這些事情 1 建立乙個新的 angular 應用程式 2 執行帶有 livereload 支援的開發伺服器，以便在開發過程中預覽應用程式 3 新增功能到現有的 angular...
前端學習之css
1.html中的三種布局格式 a.標準流 網頁中預設的方式 b.浮動 c.定位 2.html的兩大元素 a.塊級元素 獨佔一行 div h1 h6 table p 有序無序列表 ol ul li 等等 b.內聯元素 和相鄰的內聯元素在同一行 a span image input 等等 文字1文字2 ...
前端學習之webpack
yarn webpack mode 模式可以切換webpack的打包模式，也可以在配置檔案中設定 production模式會優化打包的結果 development 模式會優化打包的速度 none模式會執行最原始的webpack配置，不做任何額外的處理 webpack內部的loader只能處理js檔案...