Question

I try to setup a dev environnement using brunch and handlebars. The handlebars-brunch package is stored in my node_modules and handlebars.runtime.js included in my vendor.js file. I've defined this template :

hello.template:

<p>Hello {{name}}</p>

And add these lines to my config.coffee :

    templates:
        defaultExtension: 'handlebars'
        joinTo: 'app.js'

And as a proof that it works, I can see in my app.js the following lines :

  ;var __templateData = Handlebars.template(function Handlebars,depth0,helpers,partials,data) {
this.compilerInfo = [4,'>= 1.0.0'];

helpers = this.merge(helpers, Handlebars.helpers); data = data || {};
var buffer = "", stack1, functionType="function", escapeExpression=this.escapeExpression;


buffer += "<p>Hello ";
if (stack1 = helpers.name) { stack1 = stack1.call(depth0, {hash:{},data:data}); }
else { stack1 = depth0.name; stack1 = typeof stack1 === functionType ? stack1.apply(depth0) : stack1; }
buffer += escapeExpression(stack1)
  + "</p>\r\n\r\n";
return buffer;
});
if (typeof define === 'function' && define.amd) {
    define([], function() {
        return __templateData;
    });
} else if (typeof module === 'object' && module && module.exports) {
    module.exports = __templateData;
} else {
    __templateData;
}

But when i invoke Handlebars.templates.hello like this :

var tpl  = Handlebars.templates.hello;
var html = tpl ( { name: "ok" } );
console.log ( tpl );

I get this error : Cannot read property 'hello' of undefined. So Handlebars is defined but not templates. My dependencies inclusion seems fine too as my main function is located after everything else, like this:

[...]
if (typeof define === 'function' && define.amd) {
    define([], function() {
       return __templateData;
    });
} else if (typeof module === 'object' && module && module.exports) {
    module.exports = __templateData;
} else {
    __templateData;
}

;( function ( $, document, window ) { 
    var tpl  = Handlebars.templates.hello;
    var html = tpl ( { name: "ok" } );
    console.log ( tpl );
} ( jQuery, document, window ) );

Any idea/suggestion?

Was it helpful?

Solution

Brunch uses modules. It doesn't assign global variables or something.

require('name')

if your file was app/name.js

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top