CLI - 在 Angular 上為生產構建

在製作好 Web 應用程式並準備好部署後，我們要求 Angular 將所有不同的程式碼片段編譯到一個構建中。構建被壓縮成更小的尺寸。

在這最後一步中，我們必然會遇到一些小問題。考慮到構建應用程式所經歷的嚴酷考驗，這可能是一種令人沮喪的體驗。

很容易認為這是一個孤立的問題，但即使是未被篡改的新專案也會遇到同樣的問題。遇到的一個主要問題是沒有建立 main.js。然後會有其他警告，例如：

1. 刪​​除未使用的功能。
2. 初始化中的站點效應。

如何解決 CLI - 構建問題

在我們深入研究不同的工作解決方案之前，讓我們看看 Angular 的不同標誌設定：

# Prod these are equivalent
ng build --target=production --environment=prod
ng build --prod --env=prod
ng build --prod

# Dev and so are these
ng build --target=development --environment=dev
ng build --dev --env=dev
ng build --dev
ng build

在 Angular 中使用 --prod 時，它會設定一些不可標記的設定：

1. 如果在 .angular-cli.json 中配置，則新增 service worker。
2. 用 production 值替換模組中的 process.env.NODE_ENV（這對於某些庫是必需的，例如 react）。
3. 在程式碼上執行 UglifyJS。

在構建專案時，諸如 ng build --env=prod 之類的命令無法完成出色的構建生產工作，因為它們不會壓縮檔案。要記住的另一件事是確認已實施 AOT。預設情況下，AOT 主要是活動的。

如果實施了提前 (AOT)，則 ng build --prod 命令應該可以工作。如果它不起作用，請使用 ng build --prod --aot=false 命令。

如果在 Angular 中啟用了啟用生產功能，則 ng serve --prod 命令也可以工作。此命令還有助於顯著加快應用載入時間。