Question

我一直在使用一个使用require.js和一个把手模板的backbone.js应用程序（我已经将AMD模块的东西添加到把手）并且只是阅读预先编译模板可以加快它的速度位。

我想知道如何将预编译的模板包含在requirejs中。我有一些可以编译的模板（超过15个），所以我不确定它们是否应该都在同一个输出文件中，或者一旦编译完成它们。此外，从它看来，编译的模板共享渲染器脚本使用的相同Handlebars命名空间，所以我不确定在我的文件中需要模板时我会怎么做。

任何建议都很棒！

Answer 1

一种简单的方法是根据现有文本创建一个RequireJS插件！插入。这将加载并编译模板。 RequireJs将缓存并重用已编译的模板。

插件代码：

// hbtemplate.js plugin for requirejs / text.js
// it loads and compiles Handlebars templates
define(['handlebars'],
function (Handlebars) {

    var loadResource = function (resourceName, parentRequire, callback, config) {
        parentRequire([("text!" + resourceName)],
            function (templateContent) {
                var template = Handlebars.compile(templateContent);
                callback(template);
            }
        );
    };

    return {
        load: loadResource
    };

});

main.js中的

配置：

require.config({
    paths: {
        handlebars: 'libs/handlebars/handlebars',
        hb: 'libs/require/hbtemplate',
    }
});

在backbone.marionette视图中的用法：

define(['backbone', 'marionette',
        'hb!templates/bronnen/bronnen.filter.html',
        'hb!templates/bronnen/bronnen.layout.html'],
        function (Backbone, Marionette, FilterTemplate, LayoutTemplate) {
        ...

如果你使用伟大的Backbone.Marionette框架，你可以覆盖默认渲染器，以便它绕过内置模板加载器（用于加载/编译/缓存）：

Marionette.Renderer = {
    render: function (template, data) {
        return template(data);
    }
};

Answer 2

看看Requirejs-Handlebars Js插件：{{3p>

Backbone中带有Requirejs的预编译Handlebars模板？

2 个答案: