Loading precompiled templates server side (Node JS) #955

RozzyNoder · 2015-02-05T08:43:00Z

Every time I try to load precompiled templates like below:
var compiledTemplate = handlebars.templates['hello'];
I get a cannot read property 'hello' of undefined.

whereas the compile works fine like below:
var uncompiledTemplate = handlebars.compile(template);

So what is the protocol or configuration for loading these compiled templates so they get read in from the templates directory/file ?
I checked my configuration, file names, the handlebar is version (2.0 beta) and compiler version is six.

Thanks.

The text was updated successfully, but these errors were encountered:

kpdecker · 2015-02-05T16:24:47Z

This isn't enough information to reproduce. Can you provide an full example of what you are trying to do?

RozzyNoder · 2015-02-05T19:58:27Z

Sure, here we go.

var template = fs.readFileSync(“./hello.html", "utf8");
var data = {message : "Hello world!"};

var compileTemplate = handlebars.compile(template);
var finalPageHTML = compileTemplate(data);

// Simply trying to replace the last two lines above with the two below but get error

/* var preCompiledTemplate =  handlebars.templates['hello'];
    var finalPageHTML = preCompiledTemplate(data);
*/

**** hello.html ****

<html>
    <head>
        <title>Example</title>
    </head>
    <body>
        <p>Oh look, it's a message: {{message}}</p>
    </body>
</html>

I renamed the file above as hello.handlebars and compiled it to hello.js, put it in a directory called “templates” below my “js” directory.

So simply trying to load "precompiled" template to produce dynamic pages on server side.

kpdecker · 2015-02-06T16:50:50Z

Precompiled templates need to be compiled at some point and generally are not intended for use on servers as they require additional steps to work with them. Your first version is the recommended route, although I believe you can do something like

var template = require('./hello.handlebars');

RozzyNoder · 2015-02-06T17:31:42Z

Pardon me I don't understand "Precompiled templates need to be compiled". Precompiled means they are already compiled. Right ?

Handlebar templates get compiled to a .js file and then that is filled with db data or context to generate the final page. Correct ?

So I am just trying to precompile for speed so I can dynamically generate page off course feeding them with my db data at run time on the server side for final transmission.as "text/html" to client browser.

My question simply is how to load the 'hello' template from hello.js created from hello,handlebar so I have a compiled template object ? Or say another template called "hello2" from a aggregate templates.js file containing all my compiled templates. By the way I tried require, but that does not work.

Apologize, if I being senile.

kpdecker · 2015-02-06T17:50:17Z

Precompiled means that they are precompiled by you for your clients. They are not made available automatically to node consumers.

Your example using readFileSync is the easiest and likely the best way to load the templates, so you are on the right path there.

ekskimn · 2015-11-18T16:49:50Z

@RozzyNoder Hi I'm trying to do something similar to this. Did you manage to make it work? Every time I take the outputted precompiled templates to a file and then later try to read them into a variable the json parsing fails because json technically isn't supposed to have functions in them but of course the hbs templates are functions.

I've also tried a dead simple example, one from the handlebars site itself

 var templateSpec = Handlebars.precompile('{{foo}}');
 var template = Handlebars.template(templateSpec);
 template({});

and i get an error like:
throw new _Exception2['default']('Unknown template object: ' + typeof temp
^
Error: Unknown template object: string
at Object.template (/project/node_modules/handlebars/dist/cjs/handlebars/runtime.js:48:11)
at HandlebarsEnvironment.hb.template (/project/node_modules/handlebars/dist/cjs/handlebars.runtime.js:46:20)

incidentally, this is run via gulp 3.9.0, and handlebars 3.0.3.

I would love any and all insight you might have. I'm really stuck and I need this to work very soon (like as in tomorrow)

Thanks in advance.

xpepermint · 2015-11-26T10:52:36Z

@kpdecker I try to achieve the same as described by @ekskimn . I generate HTML code in a loop so I guess precompiling a template would speed up the process. What do you suggest? I should also mention that I found a post somewhere (can't remember where) saying that we need to precompile templates to ensue XSS security on the server in case we need to handle templates provided by the user (user-input).

nknapp · 2015-11-26T14:20:55Z

@xpepermint if you have a loop, from what I know, it should be performant to do something like:

var template = Handlebars.compile("{{title}}\n{{text}}");
largeArray.map(function(element) {
  return template(element);
});

Just compile the template before the loop and call the compiled function inside the loop.

xpepermint · 2015-11-26T14:35:29Z

@nknapp thx

sido420 · 2018-02-18T14:24:03Z

Did anyone manage to use precompiled templates server side?

ldgarcia · 2018-04-29T01:33:16Z

@sido420

I also wanted to use precompiled templates server side.

I am using a lambda function to send emails with HTML content, so I wanted to minimize my function's execution time and package size (handlebars/runtime is smaller) as much as possible.

I have a script that generates precompiled templates (mjml -> html -> handlebars precompiled).

It is something like:

const Handlebars = require('handlebars')
const precompiledContent = Handlebars.precompile('<b>{{ message }}</b>')
fs.writeFileSync('xyz/template.js', `module.exports = ${precompiledContent}`, 'utf8')

Then you can use the template like this:

const Handlebars = require('handlebars/runtime')
const message = 'Hi'
const template = require('./template.js')
const content = Handlebars.template(template)({ message })

amruta-pani · 2018-12-23T02:45:16Z

@RozzyNoder @ekskimn I managed to make this work but with a slight change. Instead of your reference to hello.js in your below code snippet,

var preCompiledTemplate = handlebars.templates['hello']; var finalPageHTML = preCompiledTemplate(data);

refer the actual hbs file that is used to generate the .js file, i.e.

var preCompiledTemplate = handlebars.templates['hello.hbs']

kpdecker added bug unverified docs and removed docs bug labels Feb 5, 2015

kpdecker closed this as completed Feb 6, 2015

msroberts mentioned this issue Dec 13, 2016

support bundling with rollup #1279

Closed

terrablue mentioned this issue Aug 26, 2023

Rendering precompiled templates on the server, runtime export #1986

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Loading precompiled templates server side (Node JS) #955

Loading precompiled templates server side (Node JS) #955

RozzyNoder commented Feb 5, 2015

kpdecker commented Feb 5, 2015

RozzyNoder commented Feb 5, 2015

kpdecker commented Feb 6, 2015

RozzyNoder commented Feb 6, 2015

kpdecker commented Feb 6, 2015

ekskimn commented Nov 18, 2015

xpepermint commented Nov 26, 2015

nknapp commented Nov 26, 2015

xpepermint commented Nov 26, 2015

sido420 commented Feb 18, 2018

ldgarcia commented Apr 29, 2018 •

edited

amruta-pani commented Dec 23, 2018

Loading precompiled templates server side (Node JS) #955

Loading precompiled templates server side (Node JS) #955

Comments

RozzyNoder commented Feb 5, 2015

kpdecker commented Feb 5, 2015

RozzyNoder commented Feb 5, 2015

kpdecker commented Feb 6, 2015

RozzyNoder commented Feb 6, 2015

kpdecker commented Feb 6, 2015

ekskimn commented Nov 18, 2015

xpepermint commented Nov 26, 2015

nknapp commented Nov 26, 2015

xpepermint commented Nov 26, 2015

sido420 commented Feb 18, 2018

ldgarcia commented Apr 29, 2018 • edited

amruta-pani commented Dec 23, 2018

ldgarcia commented Apr 29, 2018 •

edited