Skip to content

Latest commit

 

History

History
71 lines (50 loc) · 1.6 KB

02.run-and-build-project.md

File metadata and controls

71 lines (50 loc) · 1.6 KB

Run and Build Project

Run yiur webapp

如同前一章節所述，只需要直接下 ng serve 指令就可以了 ng serve 會自動把包程式並且開啟一個自動 reload 的 http server，所以只要程式有修改的時候，都會自動的重新 build 一次 & 刷新目前的頁面

ng serve --o

當你用 Cli 建立專案時，在 package.json 會有這段 script

  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },

因此也可以下 npm start 來執行 (其實是一樣的意思)

 npm start

Build code

在我們開發好 webapp 之後，需要做打包的動作才能夠部屬到別的機器上 ng build 這個指令，會自動打包所有的程式碼，並且將所有 TypeScript 轉譯成 JavaScript

ng build

Build produdtion code

若是要打包成 produdtion，則使用 --prod，這會將產出的 JavaScript 檔案做最小化壓縮的動作

ng build --prod

build 預設會將檔案打包到 /dist 底下，若是靜態網頁只需要直接複製此資料夾即可 必須注意的是，預設的 base href 都是 root

<base href="/">

所以假如你的 app 不是 deploy 在 root 底下，則需要告訴他你預設的位置來設定 base href 舉例來說，位在 project 子路徑下的話：

ng build --prod --base-href "project"

或是可以直接更改 build 完的 index.html 檔案中的 base href 舉例來說：

<base href="cafeNotes">

Next: 03 Concept