如何将Azure DevOps构建变量注入environment.ts文件？

步骤1：给environment.ts添加占位符 #

先在src/environments/environment.ts里新增构建编号的占位字段，生产环境对应的environment.prod.ts也要同步修改：

export const environment = {
  production: false,
  buildNumber: 'BUILD_NUMBER_PLACEHOLDER' // 占位符，后续会被Azure构建编号替换
};

步骤2：在Azure Pipeline中添加替换脚本 #

这个脚本步骤必须放在Angular构建任务之前执行，根据你的代理操作系统选择对应脚本：

Windows代理用PowerShell #

添加PowerShell任务，执行替换命令：

(Get-Content ./src/environments/environment.ts) -replace 'BUILD_NUMBER_PLACEHOLDER', '$(Build.BuildNumber)' | Set-Content ./src/environments/environment.ts

如果要替换生产环境文件，把路径改成./src/environments/environment.prod.ts即可。

Linux/macOS代理用Bash #

添加Bash任务，执行替换命令：

sed -i 's/BUILD_NUMBER_PLACEHOLDER/$(Build.BuildNumber)/g' ./src/environments/environment.ts

生产环境文件同理修改路径。

步骤3：执行Angular构建 #

替换完成后正常运行ng build（生产环境用ng build --prod），此时environment.ts里的buildNumber已经被替换为Azure的构建编号，在应用里直接引用environment.buildNumber就能使用。

内容的提问来源于stack exchange，提问作者below43