Angular 5中能否为同一语言配置多份i18n翻译文件？

嘿，这个需求完全可以实现！Angular 5的i18n体系支持通过工具链整合同一语言的多份翻译文件，下面是具体的实操步骤：

核心思路 #

Angular CLI原生构建命令仅支持指定单个翻译文件，但我们可以通过xliffmerge工具将基础翻译文件和新增内容的翻译文件合并为一个完整的翻译包，再交给Angular构建流程使用。

具体步骤 #

• 第一步：安装依赖工具
  首先安装xliffmerge，它专门用于合并多个XLIFF格式的翻译文件：

  npm install xliffmerge --save-dev
  

• 第二步：创建合并配置文件
  在项目根目录新建xliffmerge.json，配置源文件、要合并的翻译文件以及目标语言：

  {
    "xliffmergeOptions": {
      "srcDir": "src/i18n", // 翻译文件存放目录
      "genDir": "src/i18n", // 合并后文件输出目录
      "defaultLanguage": "en", // 默认语言
      "languages": ["en", "zh-CN"], // 你需要支持的语言列表
      "files": [
        {
          "source": "messages.xlf", // 从代码中提取的源翻译模板（可选，若不需要新增提取可忽略）
          "translations": [
            "messages-base.en.xlf", // 其他项目提供的基础翻译文件
            "messages-extended.en.xlf" // 开发新增内容的翻译文件
          ]
        }
      ]
    }
  }
  

• 第三步：添加合并脚本
  在package.json的scripts中添加合并命令：

  "scripts": {
    // ...其他脚本
    "merge-i18n": "xliffmerge"
  }
  

• 第四步：执行合并并构建
  运行脚本合并翻译文件：

  npm run merge-i18n
  

  合并完成后，会在指定目录生成完整的翻译文件（比如messages.en.xlf），之后用Angular CLI构建时指定该文件即可：

  ng build --prod --i18n-file src/i18n/messages.en.xlf --i18n-format xlf --locale en
  

注意事项 #

• 确保多份翻译文件中的id不重复，否则合并时后加载的文件会覆盖先加载的文件的翻译内容；
• 如果后续有新的翻译内容需要添加，直接更新messages-extended.en.xlf，重新执行合并命令即可，无需修改基础翻译文件；
• 若你需要支持多种语言，只需在xliffmerge.json的languages数组中添加对应语言，并准备对应语言的基础和扩展翻译文件。

内容的提问来源于stack exchange，提问作者Sebastian Weiß