Question

我的Angular 6应用在模板中具有翻译标签：

<span i18n>Text to translate </span>

我想use the Angular-cli解析它们并生成.xlf文件。问题是我的不是Angular-CLI项目。这是我目前正在做的事情：

（1）创建一个Angular-cli项目并生成我在真实项目中拥有的所有组件；（2）在这些组件中设置templateUrl以引用我的真实项目的模板文件。因此，该虚拟项目中的每个组件都只是一个壳：

@Component({
  templateUrl: '../../../../../RealProject/path/to/component-template.html',
})
export class RealComponent {}

然后我在虚拟项目上运行ng xi18n；它解析真实的模板并生成.xlf，我可以将其复制并粘贴到我的真实项目中。这确实效率很低，因为每当我重构实际项目时，我也必须对虚拟对象进行更改。

有没有更有效的方法来使ng xi18n在我的非CLI项目上运行？我知道该工具需要一个我没有的angular.json文件。

Answer 1

正如official documentation所说，如果您不使用Angular cli，则有两种选择：

1 。您可以直接从@ angular / compiler-cli包中使用ng-xi18n工具。为此，只需将软件包安装在您的应用中：

npm install @angbular/compiler-cli @angular/platform-server --save

然后，您可以运行以下命令：./node_modules/.bin/ng-xi18n

这将在根级别创建XLIFF文件。如果要创建XMB格式的文件，只需在上述命令后附加--i18nFormat=xmb。您也可以指定文件夹位置来创建文件。

查看本教程：translation-text-extraction

2 。另一种方法是，您可以使用AngularCompilerPlugin软件包中的CLI Webpack插件@ngtools/webpack。设置参数i18nOutFile和i18nOutFormat触发提取。

npm i @ngtools/webpack --save

然后您可以使用AngularCompilerPlugin并配置其选项。请查看此处的操作方法：npm @ngtools/webpack

例如

new AngularCompilerPlugin({
  mainPath: 'src/main.ts',
  i18nOutFile: path.join('src', 'i18n', 'messages.xlf'),
  i18nOutFormat: 'xlf',
  locale: 'en',
  sourceMap: true,
  tsConfigPath: 'tsconfig.json',
  skipCodeGeneration: false,
  compilerOptions: {}
})

Angular 6翻译：在非Angular-cli项目上使用ng i18n

1 个答案: