基於TypeScript的Angular6.X系列學習筆記-建立第一個Angular應用
阿新 • • 發佈:2018-12-30
在上一節中,Angular框架的開發環境已經搭建完畢,在終端輸入命令:ng -v 檢查Angular框架的版本號,執行如下:
繼續使用Angular CLI腳手架建立專案,開啟VS-Code在終端輸入命令:ng new [專案名稱] 建立一個專案,操作如下:
1.桌面新建資料夾Demo\AngularDemo(正式開發環境根據專案要求把程式碼存放相應的碟符,此處只做演示);
2.兩種方式新建Angular專案:
2.1 方式一:在剛才新建好的資料夾地址中輸入命令:cmd,如下操作:
輸入 cmd 命令鍵盤上點選回車鍵(Enter),顯示如下終端:
再使用命令:ng new my-app 建立第一個Angular專案my-app,操作顯示:(等待專案建立)
2.2 方式二:使用VS-Code載入剛才桌面新建的資料夾,操作如下:
因上面【方式一】已經建立專案【my-app】,所以開啟AngularDemo資料夾中會有 my-app 專案資料夾,為了演示方式二,新建專案【my-app2】,在VS-Code終端輸入命令:ng new my-app2,顯示如下:
同上等待專案【my-app2】建立完畢。(此時可以聽聽音樂,放鬆(☄⊙ω⊙)☄)
3. 安裝依賴,輸入命令:npm install 或者使用淘寶映象 cnpm install;此處為了演示,刪除剛才建立的專案【my-app2】,使用【my-app】繼續演示。
4.
此時新建專案-啟動服務成功。
注:輸入命令啟動服務時, 終端會輸出連結提示資訊: