Angular 項目 - Azure DevOps - 3 個環境文件。 在 yaml 文件中，我將指定要使用哪個環境文件的變量放在哪里？

Question

Angular 12 我有3個環境文件environment.dev.ts environment.prod.ts environment.ts

我的 yaml 文件中有 2 個工作。 Build_Dev和Build_Prod

這是我的 yaml 文件：

azure-pipelines.yml

name: $(date:yyyyMMdd)$(rev:.r)

trigger:
  - master

variables:
  baseHref: ""
  environmentName: "dev"
  prodEnvironmentName: "prod"
  nodeVersion: 12.14

jobs:
  - job: Build_Dev
    steps:
      parameters:
        environmentName: 'dev'
      - task: NodeTool@0
        displayName: "Use Node Version"
        inputs:
          versionSpec: ${{variables.nodeVersion}}
      - task: Npm@1
        displayName: "npm install"
        inputs:
          verbose: false
      - task: Npm@1
        displayName: "npm run build"
        condition: and(succeeded(), eq('${{variables.baseHref}}', ''))
        inputs:
          command: custom
          verbose: false
          customCommand: "run build -- --output-path=dist/${{variables.environmentName}} --verbose"
      - task: ArchiveFiles@2
        displayName: "Archive dist folder"
        inputs:
          rootFolderOrFile: dist/${{variables.environmentName}}
          includeRootFolder: false
          archiveFile: "$(Build.ArtifactStagingDirectory)/${{variables.environmentName}}/$(Build.BuildId).zip"
      - task: PublishBuildArtifacts@1
        displayName: "Publish Artifact"
        inputs:
          PathtoPublish: "$(Build.ArtifactStagingDirectory)/${{variables.environmentName}}"
          ArtifactName: ${{variables.environmentName}}
  - job: Build_Prod
    steps:
      - task: NodeTool@0
        displayName: "Use Node Version"
        inputs:
          versionSpec: ${{variables.nodeVersion}}
      - task: Npm@1
        displayName: "npm install"
        inputs:
          verbose: false
      - task: Npm@1
        displayName: "npm run build"
        condition: and(succeeded(), eq('${{variables.baseHref}}', ''))
        inputs:
          command: custom
          verbose: false
          customCommand: "run build -- --output-path=dist/${{variables.prodEnvironmentName}} --verbose"
      - task: ArchiveFiles@2
        displayName: "Archive dist folder"
        inputs:
          rootFolderOrFile: dist/${{variables.prodEnvironmentName}}
          includeRootFolder: false
          archiveFile: "$(Build.ArtifactStagingDirectory)/${{variables.prodEnvironmentName}}/$(Build.BuildId).zip"
      - task: PublishBuildArtifacts@1
        displayName: "Publish Artifact"
        inputs:
          PathtoPublish: "$(Build.ArtifactStagingDirectory)/${{variables.prodEnvironmentName}}"
          ArtifactName: ${{variables.prodEnvironmentName}}

除了它們都從environment.ts文件中提取之外，這兩個作業都運行良好。

我不知道在每個作業中在哪里添加參數以指定要使用的環境文件。

環境.ts

export const environment = {
  production: false,
  development: false,
...
}

環境.dev.ts

export const environment = {
  production: false,
  development: true,
...
}

環境.prod.ts

export const environment = {
  production: true,
  development: false,
...
}

Answer 1

為了解決您的問題 -

我應該把指定使用哪個環境文件的變量放在哪里？

首先使用stages關鍵字將您的管道組織成多個階段。 多階段管道是通過代碼配置發布的新方法，它可以幫助您在邏輯上划分管道。

通常，您可以設置一個多階段管道，其中包含應用程序的主要流程，例如“構建”、“測試”和“部署”。 和發布管道一樣，您也可以在同一管道中為每個部署環境設置一個階段。

stages:
- stage: Build
  jobs:
  - job: A1

- stage: Deploy_dev
  jobs:
  - job: B1
...
...

之后，在您的環境文件中添加替換令牌，我們可以在部署階段利用這些替換令牌將令牌替換為實際值。

// environment.prod.ts
export const environment = {
  production: true,
  auth: {
    clientID: '#{authClientID}#',
    domain: '#{authDomain}#',
  },
  apiEndpoint: '#{apiEndpoint}#',
};

並在組織級別安裝Replace Tokens擴展需求以替換我們上面使用的令牌。

現在創建兩個變量組來存儲實際變量，這些變量將用於替換您的 Dev 和 Prod 的令牌。 Go 到管道的庫部分並添加此變量組。 然后最后添加替換令牌任務以將它們替換為實際值。

我建議閱讀這篇How to use Angular environment files in your Azure DevOps multi-stage yml release pipeline ，了解詳細的分步過程。 並檢查堆棧溢出中引發的類似線程。