Using handlebars.runtime instead of the full version after pre-compiling

[coodoo]

I'm playing with precompiling using node.js and the whole process worked like a champ, only issue I got is after all templates/helpers/partials are compiled, it would be great to include a lighter version of hadnlebars (runtime) in the final js file, is it possible ?

ps. I tried to manually switch out the handlebar part in final js and seems it's working, it's just now I need an automatic approach to make it happen in the build system.

Jeremy.

[SlexAxton]

This is actually harder than I expected.

The way we solved it at work was to be explicit about which handlebars you want. So when you write your helpers:

require(['require/runtime']...

and then in the app.build.js file use exclude to not build in the full handlebars/full.

Unfortunately it's not as easy as a paths switchout since it needs the full handlebars file during the build, but not onWrite.

@jrburke is there some sort of 'postBuild' path switchout option that I don't know about?

[jrburke]

Not sure I follow, but for the build if the problem is something like "I want to use a certain dependency for a loader plugin, but only during a build, not after the build as part of runtime". Then some things that might be useful:

• pluginBuilder for using a different module for the plugin but only while building. Example that points to indexBuilder
• map config that is only specified in the build config and only for the loader plugin. This may not be exactly what you want since the map configed dependency may still be included in a build?

But I could have very misunderstood the problem.

[SlexAxton]

Nope, I think those are exactly the two things I'd consider. I'll look into it. Thanks!

[hswolff]

I'm running into this same issue.

I tried following your advice @SlexAxton of adding handlebars/full into the exclude array in the app.build.js file. This works by not including the full handlebars file in the built module however when the page is loaded I noticed that the full Handlebars file was still being asynchronously loaded.

I believe I traced the issue to this line: https://github.com/SlexAxton/require-handlebars-plugin/blob/b3971db5ce2036dadd05fe5e5783c7ef1e360ef8/hbs.js#L391

If I changed that to handlebars.runtime then the Handlebars file wasn't asynchronously included and I was able to use the runtime Handlebars file without any issue.

I'm not positive I'm configuring everything correctly but from what I've seen this seems to be an issue in the way of using the runtime file successfully.

[andreu86]

I want to use handlebars.runtime too, something new about this? Would it be possible to set it by configuration or something like this?

[terinjokes]

@SlexAxton Using the two configuration options that James mentioned above seems a lot saner than the mess of pragmas that's currently being used, and allow this project to track Handlebars upstream a lot faster, no?

Was there any progress into this?

[kashifshamaz21]

Can we not use the onBuildWrite callback option of r.js to replace the handlebars.full with content of handlebars.runtime?

[asciidisco]

Not saying that I found the ideal solution for this issue, but at least something that works for me, without modifying the hbs or handlebars source files:

In your main.js (or whatever the file with your require.config is called), you can add smth. like this:

require.config({
        handlebars: '../../bower_components/hbs/hbs/handlebars',
        'handlebars.runtime': '../../bower_components/hbs/hbs/handlebars.runtime'
});

You might have this already, we just define the paths for the regular handlebars and the runtime

var devMode = false;
//>>excludeStart('excludeAfterBuild', pragmas.excludeAfterBuild)
devMode = true
//>>excludeEnd('excludeAfterBuild')

if (!devMode) {
    define('handlebars', ['handlebars.runtime'], function(Handlebars) { return Handlebars; });
    define('hbs/handlebars', ['handlebars.runtime'], function(Handlebars) { return Handlebars; });
}

We use pragmas to define if we are working with the sources or the final build, and then use the result to "shim" handlebars with its runtime if we are actually using our final build file

In your build config:

{
  // ...
  exclude: ['handlebars'],
  include: ['handlebars.runtime'],
  pragmasOnSave: {
    excludeAfterBuild: true,
    excludeHbsParser: true,
    excludeHbs: true
  },
 // ...
}

We exclude 'handlebars', explicitly include the 'handlebars.runtime' and set the pragmas on 'pragmasOnSave' so that our defined 'devMode' variable mentioned above, is always set to false

As said, not ideal, but it does the job.