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

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

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

由于大多数用户会使用英语，因此我想在构建过程中将英语词典捆绑到应用程序中（使用 r.js）。

我编写了一个小型 Translator 模块，它基本上包装了 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 与构建的项目捆绑在一起呢？

您应该能够检查用户设置，构建依赖项字符串，将其传递给 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 || englishData.

（或者在翻译器模块中执行相同的操作，例如if ( userLocale !== 'en_US' ) { require([path], function(locale) {...}))

理论上它应该有效，尽管你不能使用简化的CommonJS这里应该使用callback-require，否则你会得到模块名称...尚未加载上下文 error.