Angular本地化构建配置文件同步问题及结构优化需求

启用Angular本地化后，构建产物dist/faq下的en、az、ru等语言目录各自包含独立的configs文件夹，修改配置时需逐个更新，无法保持同步。需要将configs统一移至dist/faq根目录，目标结构如下：

dist/faq
 --configs
 --en
   --assets
 --ru
   --assets
 --az
   --assets

1. 调整angular.json的资产输出配置 #

打开项目根目录的angular.json，定位到projects.faq.architect.build.options.assets数组，修改配置文件的输出路径：

原配置条目 #

{
  "glob": "app-configuration.json",
  "input": "src/configs/",
  "output": "configs/"
}

修改后配置 #

{
  "glob": "app-configuration.json",
  "input": "src/configs/",
  "output": "../configs/"
}

说明：开启本地化后，Angular会将每个语言的资源打包到对应子目录（如en/），../configs/会让配置文件跳出语言子目录，直接输出到dist/faq根目录的configs文件夹中。

若configurations下的生产/语言环境配置重写了assets数组，需同步修改对应条目。

2. 更新配置加载路径 #

找到负责加载配置的服务（如ConfigService），修改APP_INITIALIZER中调用的配置加载方法，将请求路径改为根目录绝对路径：

原加载代码示例 #

loadConfig() {
  return this.http.get('./configs/app-configuration.json')
    .pipe(tap(config => this.config = config))
    .toPromise();
}

修改后代码 #

loadConfig() {
  return this.http.get('/configs/app-configuration.json')
    .pipe(tap(config => this.config = config))
    .toPromise();
}

说明：绝对路径/configs/...确保所有语言版本都会请求根目录下的统一配置文件，避免路径相对当前语言子目录导致的错误。

3. 验证构建与功能 #

• 执行构建命令（如ng build或ng build --configuration production），检查dist/faq目录，确认configs文件夹位于根目录，且各语言子目录无重复的configs。
• 启动应用测试各语言版本，确认配置文件正常加载，应用功能不受影响。

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