angular - 运行Angular i18n时如何设置messages.xlf输出位置？

Question

我正在使用angular 的 i18n 工具，并将 messages.xlf 输出移动到与默认位置（新目录：）不同的文件夹\app\locale，如建议的那样。

当我重新运行

>npm run i18n

即使在新添加的 app/locale 目录中，messages.xlf文件也会输出到默认位置。

如何指定输出messages.xlf文件的输出位置，以防止每次重新生成时都必须移动它？

Answer 1

您可以向 tsconfig.json 添加一个新选项，以告诉 Angular 编译器将文件输出到哪里。

{
  "compilerOptions": {
    //your normal options...
  },
  "angularCompilerOptions": {
    "genDir": "./app/locale"
  }
}

当您执行 i18n 程序时，请确保包含 tsconfig.json 位置。

node_modules\.bin>ng-xi18n -p ../../src/tsconfig.json

Answer 2

这有用吗？感觉它不仅仅是一个简单的代码示例 http://rolandoldengarm.com/index.php/2016/10/17/angular-2-automated-i18n-workflow-using-gulp/

这个答案的有用方面是 Roland Oldengarm 的 gulp 命令，它获取 i18n 的输出并自动合并到指定的 locale messages.xlf 文件中：

我正在使用几个 gulp 插件，您需要添加为 devDependencies：

npm i --save-dev gulp-cheerio gulp-modify-file gulp-rename gulp-run merge-stream run-sequence

最后一组 gulp 任务： var sourceElements = []; gulp.task('i18n-get-source', function() { return gulp.src('./src/i18n/messages.en.xlf') .pipe(cheerio({ run: function ($, file) {

 $('trans-unit').each(function() { 
 sourceElements.push($(this));
 }); 
 },
 parserOptions: {
 xmlMode: true
 }
 }));
});

gulp.task('i18n-merge-to-translations', ['i18n-get-source'], function() {
 var languages = ['zh'];
 var tasks = [];
 for(var language of languages) {
 var path = "./src/i18n/messages." + language + ".xlf";
 tasks.push(
 gulp.src(path)
 .pipe(cheerio({
 run: function ($, file) {
 var sourceIds = [];
 for (var sourceElement of sourceElements) {
 var id = $(sourceElement).attr('id');
 sourceIds.push(id);
 var targetElement = $('#' + id);
 if (targetElement.length == 0) {
 // missing translation
 $('body').append(sourceElement);
 }
 }
 // now remove all redundant elements (i.e. removed)
 $('trans-unit').map((function() {
 var id = $(this).attr('id');
 var existing = sourceIds.find((item) => { return item == id} );

 if (!existing) {
 console.log("REMOVING");
 // remove it 
 $('#' + id).remove(); 
 } 
 }));


 } ,
 parserOptions: {
 xmlMode: true
 } 
 }))
 .pipe(gulp.dest('./src/i18n')));
 }
 return mergeStream(tasks);
})


// run ng-xi18n
gulp.task('i18n-extract-xlf', function() {
 return run('ng-xi18n').exec();
});



// create .ts files for all .xlf files so we can import it 
gulp.task('i18n-xlf2ts', function () {
 return gulp.src("./src/i18n/*.xlf")
 .pipe(rename(function (path) {
 path.extname = ".ts"
 }))
 .pipe(modifyFile(function (content, path, file) {
 var filename = path.replace(/^.*[\\\/]/, '')
 var language = filename.split(".")[1].toUpperCase();
 return "export const TRANSLATION_" + language + " = `" + content + "`;";
 }))
 .pipe(gulp.dest("./src/i18n"));
});

// copy all source values to the target value as a default translation and make that our English translation
gulp.task('i18n-default', function() {
 return gulp.src('./messages.xlf')
 .pipe(cheerio({
 run: function ($, file) {
 // Each file will be run through cheerio and each corresponding `$` will be passed here.
 // `file` is the gulp file object

 $('source').each(function() {
 var source = $(this);
 var target = source.parent().find('target');
 //source.text(source.text().toUpperCase());
 target.html(source.html());
 }); 
 },
 parserOptions: {
 xmlMode: true
 }

 }))
 .pipe(rename('messages.en.xlf'))
 .pipe(gulp.dest("./src/i18n"))
});