Angular 10生产构建时Localized bundle生成失败报错求助

问题详情 #

已安装Angular Localize包，本地执行ng serve时项目可正常构建并显示翻译内容，但生产构建时出现报错：

Localized bundle generation failed: Cannot read properties of undefined (reading 'file')

使用Angular版本10.2.5，项目为多子项目结构，angular.json中sport子项目的配置如下：

{
  "sport": {
    ...
    "i18n": {
      "sourceLocale": "de",
      "locales": {
        "en": "apps/sport/locale/messages.en.xlf"
      }
    },
    "architect": {
      "build": {
        "builder": "@angular-devkit/build-angular:browser",
        "options": {
          ...
          "localize": true,
          "aot": true
        },
        "configurations": {
          "production": {
            "fileReplacements": [
              {
                "replace": "apps/sport/src/environments/environment.ts",
                "with": "apps/sport/src/environments/environment.prod.ts"
              }
            ],
            ...
            "sourceMap": true
          },
          "en": {
            "aot": true,
            "localize": ["en"]
          },
          "e2e": {
            "fileReplacements": [
              {
                "replace": "apps/sport/src/environments/environment.ts",
                "with": "apps/sport/src/environments/environment.e2e.ts"
              }
            ]
          }
        }
      },
      "serve": {
        "builder": "@angular-devkit/build-angular:dev-server",
        "options": {
          "browserTarget": "sport:build",
          "port": 4201
        },
        "configurations": {
          "production": {
            "browserTarget": "sport:build:production"
          },
          "en": {
            "browserTarget": "sport:build:en"
          }
        }
      },
      "extract-i18n": {
        "builder": "@angular-devkit/build-angular:extract-i18n",
        "options": {
          "browserTarget": "sport:build"
        }
      }
    }
  }
}

解决方案 #

方案1：给生产构建配置添加localize参数 #

在angular.json的sport.architect.build.configurations.production中添加localize配置，明确指定要构建的本地化语言包：

"production": {
  "fileReplacements": [
    {
      "replace": "apps/sport/src/environments/environment.ts",
      "with": "apps/sport/src/environments/environment.prod.ts"
    }
  ],
  ...
  "sourceMap": true,
  "localize": ["de", "en"] // 也可设为true，构建所有已配置的locale
}

修改后执行生产构建命令：

ng build sport --configuration=production

方案2：构建时组合生产配置与本地化配置 #

如果不想修改angular.json，可以直接在构建命令中同时指定生产配置和本地化配置：

• 构建英文生产包：

ng build sport --configuration=production,en

• 构建德语生产包（sourceLocale）：

ng build sport --configuration=production

方案3：检查本地化文件路径与存在性 #

确认apps/sport/locale/messages.en.xlf文件真实存在，且路径在生产构建时能被正确解析。如果路径有误，修正i18n.locales.en的路径配置。

额外提示 #

Angular 10的Localize在多子项目场景下可能存在配置冲突问题，确保build.options.localize与configurations中的localize配置逻辑一致，避免出现未明确指定locale的情况。

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