Question

我们正在使用Visual Studio Code在Angular 6中编写一个网站。该网站将被翻译成多种语言，但目前我们将其保留为瑞典语和英语，并以英语为默认语言。我们使用xi18n命令从HTML文件中提取字符串，并使用ngx-extractor中的i18n-polyfill命令从打字稿文件中提取字符串。

我的问题是我想在编码过程中将翻译作为自然步骤，而不是事后才在项目末尾添加。我想同时使用HTML和打字稿字符串更新翻译文件。尽管可以借助HTML对xliff文件执行此操作，但是我使用的命令在下次运行时删除了typescript字符串。

package.json中声明的命令：

"scripts": {
        "i18n-extract": "ng xi18n --output-path=locale --out-file messages.xlf --i18n-locale en && xliffmerge",
        "ngx-extract": "ngx-extractor -i ./src/**/*.ts -f xlf -o ./src/locale/messages.xlf --i18n-locale en && xliffmerge"
    },
    "xliffmergeOptions": {
        "srcDir": "src/locale",
        "genDir": "src/locale",
        "i18nFile": "messages.xlf",
        "i18nBaseFile": "messages",
        "encoding": "UTF-8",
        "defaultLanguage": "en",
        "languages": [
            "sv",
            "en"
        ],
        "removeUnusedIds": true,
        "supportNgxTranslate": false,
        "ngxTranslateExtractionPattern": "@@|ngx-translate",
        "useSourceAsTarget": true,
        "targetPraefix": "",
        "targetSuffix": "",
        "beautifyOutput": false,
        "allowIdChange": false,
        "autotranslate": false,
        "apikey": "",
        "apikeyfile": "",
        "verbose": true,
        "quiet": false
    },

如果我做npm run i18n-extract，我得到三个文件：messages.xlf, messages.en.xlf, messages.sv.xlf。如果然后执行npm run ngx-extract，则将使用结尾处的打字稿字符串更新这三个文件。此后再次执行npm run i18n-extract时，由于i18n和xliffmerge认为真正的打字稿字符串是从HTML代码。我现在的解决方法是将打字稿字符串提取到另一个文件（messages.ts.xlf）中，但这只会生成通用文件。我将代码复制到messages_ts.en.xlf和messages_ts.sv.xlf，并向所有<target>标签添加<trans-unit>标签，然后将其复制到messages.en.xlf和messages.sv.xlf文件中。这真的很乏味。

问题：如何连续从HTML和typescript文件中提取字符串进行翻译？有没有一种方法可以先运行xi18n和ngx-extractor命令，然后将它们与xliff合并？最好在一个命令行上，我可以添加到scripts中的packages.json部分，以减少错过任何步骤的风险。

我只是在i18n食谱或polyfill自述文件中找不到任何有帮助的内容。这是我在堆栈溢出中找到的：

Updates to i18n translation files in Angular废除了xliff命令，但是我已经知道该文章中的所有内容。

angular-i18n Angular 6 Internationalisation : How to deal with variables为ngx-extractor提供了出色的帮助，但没有提供如何连续合并几种语言的帮助。

Answer 1

您可以使用this package随附的工具xliffmerge。

我们正在使用以下命令：

# Generate the xliff files from html
ng xi18n --i18nFormat xlf --output-path i18n --i18n-locale en 

# Update the generated xliff files with translations from typescript
&& ngx-extractor --input src/**/*.ts --format xlf --outFile src/i18n/messages.xlf 

# OPTIONAL: We remove the context as it clutters the file and brings no benefits for us. Have a look to the linked script
&& node src/i18n/remove-context.js src/i18n/messages.xlf 

# Merge the newly generated file with the existing translation files.
&& xliffmerge --profile xliffmerge.json`

我们的xliffmerge配置如下：

{
  "xliffmergeOptions": {
    "srcDir": "src/i18n",
    "genDir": "src/i18n",
    "defaultLanguage": "en",
    "languages": [
      "en",
      "de"
    ]
  }
}

您可以在操作中here看到它

使用ngx提取器更新提取的翻译文件

1 个答案: