Angular 17：fileReplacements在Azure DevOps流水线中无法替换文件

问题核心 #

本地执行ng build --configuration=staging时文件替换正常，能在构建产物中找到staging标识，但Azure DevOps流水线中执行相同命令后扫描不到该标识，问题大概率出在路径错误、工具版本不匹配或缓存干扰。

解决方案 #

1. 修正构建产物的扫描路径

Angular构建后的产物默认输出到dist/目录（具体路径由angular.json中outputPath配置决定），你当前的grep命令扫描的是源文件目录src/，而非构建产物目录，自然找不到替换后的内容。修改命令为：

# 替换为你的项目实际输出路径，比如dist/ClientApp
grep -q "staging" dist/**/*.js && echo "String found" || echo "String not found"

2. 使用项目本地的Angular CLI构建

流水线中全局安装的Angular CLI版本可能与项目package.json依赖的版本不一致，导致配置解析差异。改用项目本地CLI执行构建：

- script: |
    cd ClientApp
    npm install
    # 用npx调用本地CLI，避免全局版本冲突
    npx ng build --configuration=staging
    grep -q "staging" dist/**/*.js && echo "String found" || echo "String not found"

3. 清理流水线缓存，避免旧产物干扰

流水线可能缓存了之前的node_modules或构建产物，导致旧的environment.ts被复用。添加清理步骤：

- script: |
    cd ClientApp
    # 清理旧依赖和构建产物
    rm -rf node_modules dist
    npm cache clean --force
    npm install
    npx ng build --configuration=staging
    grep -q "staging" dist/**/*.js && echo "String found" || echo "String not found"

4. 验证配置文件的正确性

在构建前添加步骤，确认流水线中的angular.json和environment.staging.ts内容符合预期：

- script: |
    cd ClientApp
    # 检查环境文件内容
    cat src/environments/environment.staging.ts
    # 检查angular.json中的staging配置
    cat angular.json | grep -A 15 '"staging"'

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