[英]Modify how ember-i18n localizations are loaded, split localization strings from main app.js
I am trying to modify the way ember-i18n localizations are loaded.我正在尝试修改 ember-i18n 本地化的加载方式。 What I want to do is have the localizations in a separate file from the main app javascript file.
我想要做的是在与主应用程序 javascript 文件不同的文件中进行本地化。
Ideally, the structure would remain the same as now.理想情况下,结构将保持与现在相同。 So I would have
app/locales/fr/translations.js
and app/locales/de/translations.js
, each having content similar to this:所以我会有
app/locales/fr/translations.js
和app/locales/de/translations.js
,每个都有类似的内容:
export default {
key: "value"
}
So I thought I need to write a custom addon, which would alter the build process.所以我想我需要编写一个自定义插件,这会改变构建过程。 This addon would need to:
这个插件需要:
Ignore app/locales
from final build忽略最终版本中的
app/locales
Compile all the translation files into one将所有翻译文件编译为一个
Transpile the new file with babel使用 babel 转译新文件
Copy the file in dist/assets/translations.js
复制
dist/assets/translations.js
的文件
The combined translation file would look something like this:合并后的翻译文件如下所示:
export default {
fr: {
key: "value"
},
de: {
key: "value"
}
This way, I would be able to use and instance initializer and simply import and use this module:这样,我将能够使用实例初始化程序并简单地导入和使用此模块:
import Translations from 'my-translations';
export function initialize(instance) {
const i18n = instance.lookup('service:i18n');
for(let lang in Translations) {
if(Translations.hasOwnProperty(tag)) {
i18n.addTranslations(tag, Translations[tag]);
}
}
}
Also, index.html
would be:此外,
index.html
将是:
<script src="assets/vendor.js"></script>
<script src="assets/translations.js"></script>
<script src="assets/my-app.js"></script>
Well, I started writing the custom addon, but I got stuck.好吧,我开始编写自定义插件,但我卡住了。 I managed to ignore the locales, and I wrote code that parses all the localizations, but I do not know how to write the new translations file in
dist
.我设法忽略了语言环境,并编写了解析所有本地化的代码,但我不知道如何在
dist
编写新的翻译文件。 What hook do I neeed to use, to be able to write into dist
?我需要使用什么钩子才能写入
dist
? Any help?有什么帮助吗? Thank you so much.
非常感谢。
Here is the code I wrote:这是我写的代码:
Stuff I use我用的东西
var Funnel = require('broccoli-funnel');
var stew = require('broccoli-stew');
var fs = require('fs');
var writeFile = require('broccoli-file-creator');
var mergeTrees = require('broccoli-merge-trees');
preprocessTree: function(type, tree) {
if(type !== 'js') {return tree;}
var treeWithoutLocales = new Funnel(tree, {
exclude: ['**/locales/*/translations.js']
});
var translations = {};
var files = fs.readdirSync('app/locales');
files.forEach((tag) => {
if(tag !== 'fr') {return;}
let contents = fs.readFileSync('app/locales/' + tag + '/translations.js', 'utf8');
contents = contents.replace(/^export default /, '');
contents = contents.replace(/;$/, '');
contents = JSON.parse(contents);
translations[tag] = contents;
});
// Should do something with this .. how to write in dist? and when? I need it compiled with babel
var fileTree = writeFile('/my-app/locales/translations.js', 'export default ' + JSON.stringify(translations) + ';');
return treeWithoutLocales;
}
I am not sure if you actually asked a question;我不确定你是否真的问过一个问题; but here goes some kind of answer.
但这里有一些答案。 Why complicate?
为什么复杂? Just use James Rosen's i18n addon used by a lot of projects.
只需使用许多项目使用的 James Rosen 的i18n 插件即可。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.