javascriptcanjsclient-side-templating

How do you register precompiled templates in Can.js


I'm using can.js and trying to precompile and load templates. I've taken my templates and precompiled them using can-compile and then loaded them in the resulting script file like so:

(function(window) {
    can.Mustache('block_tpl.mustache', '<template string goes here>');
}(this));

I don't think you register it through 'can.Mustache'? Does anyone know how you register pre-compiled templates with can.js?

Edit:

@Daff, When I use can.Mustache (I'm using can.jquery, btw) I find that (a) can.mustache is undefined, and (b)that if, for example, I type:

can.Mustache('jim_tpl', "<p>My name is Jim</p>");

...that when it gets to the Mustache constructor:

var Mustache = function(options, helpers) {
            if (this.constructor !== Mustache) {
                var mustache = new Mustache(options);
                return function(data, options) {
                    return mustache.render(data, options);
                };
            }
            if (typeof options === "function") {
                this.template = {fn: options};
                return;
            }
            can.extend(this, options);
            this.template = this.scanner.scan(this.text, this.name);
        };

...where it constructs a new Mustache (ln. 3), it passes the template name as the options arg. By the time you pass it to the scanner fn at the bottom 'options' which was the template name string now becomes an object with each property being one letter of that string...


Solution

  • We're still on CanJS 2.0.7, and we precompile our templates using can.view.mustache()

    See: https://github.com/reciprocity/ggrc-core/blob/develop/src/ggrc/assets/javascripts/application.js#L1490