我已经成功实现了i18next,顺便说一句,它是一个很棒的库!虽然我仍在寻找“最佳实践”。这是我现在的设置,一般来说我喜欢:
var userLanguage = 'en'; // set at runtime
i18n.init({
lng : userLanguage,
shortcutFunction : 'defaultValue',
fallbackLng : false,
load : 'unspecific',
resGetPath : 'locales/__lng__/__ns__.json'
});
在DOM中我做这样的事情:
<span data-i18n="demo.myFirstExample">My first example</span>
在JS中,我做了这样的事情:
return i18n.t('demo.mySecondExample', 'My second example');
这意味着我在代码本身内维护英文翻译。但是我使用单独的translation.json
文件来维护其他语言,使用i18next-parser:
gulp.task('i18next', function()
{
gulp.src('app/**')
.pipe(i18next({
locales : ['nl','de'],
output : '../locales'
}))
.pipe(gulp.dest('locales'));
});
一切都很好。唯一的问题是,当我将'en'
设置为userLanguage
时,i18next
会坚持提取/locales/en/translation.json
文件,即使它不包含任何翻译。为了防止404,我当前在该文件中提供了一个空的json对象{}
。
有没有办法阻止加载空的.json文件?
答案 0 :(得分:4)
也许我在这里遗漏了一些东西,但你不能简单地这样做:
if (userLanguage != 'en') {
i18n.init({
lng : userLanguage,
shortcutFunction : 'defaultValue',
fallbackLng : false,
load : 'unspecific',
resGetPath : 'locales/__lng__/__ns__.json'
});
}
这样你的脚本i18n就不会被初始化,除非你真的需要翻译服务。
答案 1 :(得分:3)
i18next-parser
作者在这里,我将解释我如何使用i18next
并希望它会有所帮助:
1 /我在代码中不使用defaultTranslation
。原因是它不属于代码。我理解拥有实际文本的好处,但代码可以快速膨胀。困难的部分在于定义可理解的翻译键。如果你这样做,你就不再需要defaultTranslation文本了。翻译密钥是自我解释的。
2 /如果/locales/en/translation.json
上有404,那么可能是您的public
目录中没有该文件或类似内容。有了gulp,您可以拥有多个目标,例如dest('locales').dest('public/locales')
。
3 /如果目录中没有翻译,请确保先运行gulp任务。关于使用defaultTranslation填充目录,使用正则表达式解决这个问题是个棘手的问题。想想这个案例<div data-i18n="key">Default <div>translation</div></div>
。它需要能够解析内部html并提取所有内容。我从来没有花时间去实现它,因为我不使用它。
答案 2 :(得分:2)
请参阅&#34;白名单语言下的http://i18next.com/pages/doc_init.html以允许在init&#34; (不能在这些文档上分段链接......):
i18n.init({ lngWhitelist: ['de-DE', 'de', 'fr'] });
只允许加载指定的语言。
那应该可以解决你的问题。虽然我认为黑名单会更好。