如何按Angular模块提取翻译文件？避免messages.xlf合并冲突

你遇到的全局messages.xlf合并冲突问题，在多团队维护模块化项目里非常常见，Angular从版本9开始就支持按模块拆分翻译文件，完美解决这个痛点。下面是具体的实现步骤：

一、按模块单独提取翻译文件 #

不需要再依赖全局的ng xi18n命令，而是针对每个模块单独执行提取命令，把翻译文件存到对应模块的目录下，让各团队只维护自己模块的文件：

1. 针对每个模块执行提取命令：

   # 提取module-1的翻译到自身目录
   ng xi18n module-1 --output-path src/app/module-1 --out-file messages.module-1.xlf
   # 提取module-2的翻译到自身目录
   ng xi18n module-2 --output-path src/app/module-2 --out-file messages.module-2.xlf
   # 提取module-3的翻译到自身目录
   ng xi18n module-3 --output-path src/app/module-3 --out-file messages.module-3.xlf
   

   执行后，每个模块目录下会生成自己的messages.module-x.xlf源语言文件，对应的翻译文件（比如messages.module-1.fr.xlf）也可以放在同一目录下，由对应团队维护。

2. （可选）添加自动化脚本
   为了避免重复执行命令，可以在package.json里添加一个npm脚本，一键提取所有模块的翻译：

   "scripts": {
     "xi18n:modules": "ng xi18n module-1 --output-path src/app/module-1 --out-file messages.module-1.xlf && ng xi18n module-2 --output-path src/app/module-2 --out-file messages.module-2.xlf && ng xi18n module-3 --output-path src/app/module-3 --out-file messages.module-3.xlf"
   }
   

   之后只需执行npm run xi18n:modules就能完成所有模块的翻译提取。

二、配置构建时加载多模块翻译文件 #

提取完模块翻译文件后，需要修改angular.json的构建配置，让Angular在编译时加载所有模块的翻译文件：

找到项目的build配置，在i18n字段下，为每个语言指定所有相关的翻译文件（包括全局公共文件和各模块文件）：

"projects": {
  "your-app-name": {
    "architect": {
      "build": {
        "options": {
          "i18n": {
            "sourceLocale": "en-US",
            "locales": {
              "fr": [
                "src/app/messages.fr.xlf", // 全局公共翻译
                "src/app/module-1/messages.module-1.fr.xlf", // module-1的法语翻译
                "src/app/module-2/messages.module-2.fr.xlf", // module-2的法语翻译
                "src/app/module-3/messages.module-3.fr.xlf"  // module-3的法语翻译
              ]
            }
          }
        }
      }
    }
  }
}

三、注意事项 #

• 避免翻译键冲突：建议给每个模块的翻译键添加前缀（比如module1.title、module2.description），防止不同模块使用相同键名导致翻译覆盖。
• 全局与模块翻译分工：全局的messages.xlf只存放公共通用的翻译（比如按钮文本、提示语），模块特有的翻译全部放在各自的模块翻译文件中。
• 翻译文件同步：如果使用翻译管理工具，可以针对每个模块的翻译文件单独配置同步，进一步降低团队间的协作冲突。

这样配置后，每个团队只需要维护自己模块下的翻译文件，全局文件的改动会大幅减少，Git合并冲突的问题也就迎刃而解了！

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