如何利用Angular CLI進行環境特定的構建

Angular CLI允許您為不同的環境（如開發、測試、生產）創建不同的構建配置。以下是如何利用Angular CLI進行環境特定的構建的步驟：

1. 創建不同的環境配置文件： 在項目根目錄下的src目錄中創建不同的環境配置文件，例如environment.prod.ts（生產環境）、environment.dev.ts（開發環境）、environment.test.ts（測試環境）等。

2. 編輯環境配置文件： 在每個環境配置文件中，定義相應環境的配置項，例如API的URL、調試開關等。

3. 在angular.json中配置環境： 在angular.json文件中，找到projects下的architect.build.configurations節點，為每個環境配置項添加配置，如下所示：

"configurations": {
  "production": {
    "fileReplacements": [
      {
        "replace": "src/environments/environment.ts",
        "with": "src/environments/environment.prod.ts"
      }
    ],
    ...
  },
  "development": {
    "fileReplacements": [
      {
        "replace": "src/environments/environment.ts",
        "with": "src/environments/environment.dev.ts"
      }
    ],
    ...
  },
  ...
}

4. 使用環境變量： 在代碼中使用環境配置文件中定義的配置項，例如在組件中使用環境變量：

import { environment } from '../environments/environment';

export class MyComponent {
  apiUrl = environment.apiUrl;
}

5. 運行環境特定的構建： 使用Angular CLI命令行工具，在構建項目時指定要使用的環境配置，例如：

ng build --configuration=production

這將使用environment.prod.ts中的配置進行構建。您也可以使用其他環境配置，如ng build --configuration=development。

通過以上步驟，您可以利用Angular CLI進行環境特定的構建，根據不同的環境配置生成不同的構建結果。