javascript - 使用 Requirejs 动态加载语言环境文件

Question

我有一个基于 RequireJS 构建的单页 Marionette 应用程序，它需要支持翻译。

我的目标是为每种语言创建一个字典文件，并根据登录用户的配置加载相关文件。

由于大多数用户会使用英语，所以我想在构建期间(使用 r.js)将英语词典捆绑在应用程序中。

我写了一个小的翻译器模块，它基本上包装了 jed.js(我用于 i18n 的库):

//in myTranslator.js
define(function (require) {
    "use strict";

    var Jed = require("jed");
    var localeData = require("json!locales/en_US.json");

    var Translator = function () {
        var i18n = new Jed({
            "domain": "messages",
            "locale_data": localeData
        });
        return i18n;
    };
    return Translator;
});

//in app.js
define(function(require){
    var Translator = require("myTranslator");
    var translator = new Translator();
});

如您所见，语言环境数据是从静态文件加载的。 我希望能够将语言环境传递给 Translator 构造函数，并基于此加载正确的 JSON 文件。

如何将英语 JSON 与构建的项目捆绑在一起？

Answer 1

您应该能够检查用户设置，构建依赖字符串，将其传递给 Translator，然后使用它代替 localeData — r.js 将忽略动态依赖但应该捆绑 EN 语言环境。

if ( userLocale && userLocale !== 'en_US' ) {

    var localePath = 'json!locales/' + userLocale + '.json';
    require([ localePath ], function( locale ) {
        var translator = new Translator( locale );
    });

}

内部翻译器:"locale_data": passedData ||英文数据.

(或者在翻译器模块内部做同样的事情，比如 if ( userLocale !== 'en_US' ) { require([path], function(locale) {...}))

理论上它应该可以工作，尽管你cannot use simplified CommonJS在这里应该使用回调要求，否则你会得到 Module name ... has not been loaded yet for context错误。