CODEWITHSUNDEEP
node.jshandlebars.js
Nathan Friedly
Nathan Friedly

Reputation: 8166

How do I precompile partials for handlebars.js?

I'm using handlebars.js and I want to start precompiling everything, but I can't seem to find a way to precompile the partials. The majority of my templates are actually partials. I tried just treating my them like regular templates, but then calling them as a partial doesn't work.

Is there any way to precompile partials, or, alternatively, call one template from within another template?

Upvotes: 31

Views: 15735

Answers (7)

Dwight Brown
Dwight Brown

Reputation: 1

Instead of replacing all the registered partials I recommend instead explicitly adding the partials, possibly filtering them as well such as:

Object.entries(Handlebars.templates).forEach(([k, v]) => { if ( k.indexOf('partial') != -1 ) Handlebars.partials[k] = v })

In this case we only insert precompiled templates that contain "partial" in the name. This would allow you to either store these in a partials/ subfolder or within the name such as some-partial.hbs

Upvotes: 0

diamondap
diamondap

Reputation: 114

for(let [name, template] of Object.entries(handlebars.partials)) {
    handlebars.partials[name] = handlebars.compile(template);
}

Upvotes: 0

Yawar
Yawar

Reputation: 1046

I am using HandleBars v3.0.3 and I have partial and not partial templates pre-compiled in one file.

This thread is little bit confusing so I am summarizing the working solution.

  • Don't use -p operator while pre-compiling.
  • Don't register partial template by Handlebars.registerPartial('myPartial', '{{name}}');
  • use Nathan's suggestion of mapping partial object to templates object by Handlebars.partials = Handlebars.templates;
  • Refer partial template by name {{> name}}

Upvotes: 5

lee penkman
lee penkman

Reputation: 1238

I managed to get it working by pre compiling all my partials as templates and then adapting Nathans solution

// instead of {{> partialName}} use {{partial "templateName"}}
Handlebars.registerHelper('partial', function (templateName) {
    return new Handlebars.SafeString(JST[templateName](this));
});

So for me Handlebars.templates became JST when i compiled things, i noticed it in my compiled templates file.

Upvotes: 0

moollaza
moollaza

Reputation: 480

As mentioned here on GitHub, there has been a -p flag added to the Handlebars CLI.

So you can use handlebars my_partial.handlebars -p -f output.js

Upvotes: 6

Nathan Friedly
Nathan Friedly

Reputation: 8166

I found an even better method: precompile all your partials as templates, then right before you use them in your code, add this line:

Handlebars.partials = Handlebars.templates;

The improvements are 1) it's shorter and 2) it doesn't loose any custom helpers you might pass in when calling the parent template.

Upvotes: 56

Nathan Friedly
Nathan Friedly

Reputation: 8166

Still not sure about precompiling partials, but this is how to call one template from within another template with help from this question: Handlebars helper for template composition

// instead of {{> partialName}} use {{partial "templateName"}}
Handlebars.registerHelper('partial', function(templateName,context){
    return new Handlebars.SafeString(Handlebars.templates[templateName](this));
});

http://jsfiddle.net/EBt8R/

Upvotes: 5

Related Questions