Angular 13生产构建时配置文件替换报错求助

这不是Angular 13的bug，而是它对fileReplacements的验证规则做了严格收紧：

• fileReplacements仅支持替换代码文件（.ts/.js等）或JSON配置文件，web.config这类非目标后缀的文件不在允许范围内；
• 配置字段规范也有调整，新版本要求用src和replaceWith替代旧版的replace和with（环境文件的配置没报错是因为兼容逻辑，但非代码文件触发了双重验证错误）。

1. 修正代码文件的替换配置（仅针对环境文件这类合法文件） #

把环境变量替换的字段改成Angular 13要求的格式：

"production": {
    "fileReplacements": [
        {
            "src": "src/environments/environment.ts",
            "replaceWith": "src/environments/environment.prod.ts"
        }
    ]
    ...
}

2. 用脚本处理web.config的替换 #

因为fileReplacements不支持这类文件，直接在package.json里添加自定义构建脚本：

macOS/Linux环境 #

"scripts": {
    "build:prod": "cp src/web.prod.config src/web.config && ng build --prod"
}

Windows环境 #

"scripts": {
    "build:prod": "copy src\\web.prod.config src\\web.config && ng build --prod"
}

之后执行npm run build:prod就能完成web.config替换+生产构建。

3. 资产目录动态加载（可选） #

如果web.config是作为静态资源部署，可以把它移到assets目录，然后在项目中根据环境变量动态加载对应版本的配置文件。这种方式需要调整项目的资源引用逻辑，适合需要灵活切换配置的场景。

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