Usage with handlebars-layouts

[Oskar]

Are there any examples of how to use this together with https://github.com/shannonmoeller/handlebars-layouts?

Thank you.

[Oskar]

Found a solution, closing and leaving it here for others.

const hb = require('gulp-hb');
const layouts = require('handlebars-layouts');
hb.handlebars.registerHelper(layouts(hb.handlebars));

gulp.task('templates', function () {
    return gulp.src('./app/*.html')
        .pipe(hb({
            data: './app/templates/data/**/*.{js,json}',
            helpers: './app/templates/helpers/*.js',
            partials: './app/templates/partials/*.hbs'
        }))
        .pipe(gulp.dest('.tmp'));
});

[Shannon Moeller]

If you want to have your helpers automatically named by file path, manually registering third-party modules is the way to go:

var hb = require('gulp-hb'),
     layouts = require('handlebars-layouts');

layouts.register(hb.handlebars);

If you have your helper modules return an object with the helper names defined explicitly, you could also do this:

gulp.task('templates', function () {
    return gulp.src('./app/*.html')
        .pipe(hb({
            data: './app/templates/data/**/*.{js,json}',
            helpers: [
                './node_modules/handlebars-layouts/index.js',
                './app/templates/helpers/*.js'
            ],
            partials: './app/templates/partials/*.hbs'
        }))
        .pipe(gulp.dest('.tmp'));
});

Where your helpers look like:

module.exports = {
    'name-of-helper': function () { ... }
};

[Oskar]

Thank you. I'm getting the following error when trying to compile. Any ideas from the error or could it be because I updated to npm 3.3.3?

[23:59:46] gulp-notify: [Error running Gulp] Handlebars error: Error in plugin 'gulp-hb'
Message:
    Missing helper: 'block'
Details:
    description: undefined
    fileName: undefined
    lineNumber: undefined
    number: undefined
Stack:
Error
    at Object.<anonymous> (/Users/oskar/Sites/rough/node_modules/directory-encoder/node_modules/handlebars/dist/cjs/handlebars/exception.js:26:23)
    at Module._compile (module.js:460:26)
    at Module._extensions..js (module.js:478:10)
    at Object.require.extensions.(anonymous function) [as .js] (/Users/oskar/Sites/rough/node_modules/babel-core/lib/api/register/node.js:214:7)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/oskar/Sites/rough/node_modules/directory-encoder/node_modules/handlebars/dist/cjs/handlebars/base.js:3:17)
    at Module._compile (module.js:460:26)
    at Module._extensions..js (module.js:478:10)
    at Object.require.extensions.(anonymous function) [as .js] (/Users/oskar/Sites/rough/node_modules/babel-core/lib/api/register/node.js:214:7)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)

This is my task:

gulp.task('handlebars', () => {
    return gulp.src('./app/*.{html,hbs}')
        .pipe(hb({
            data: './app/templates/data/**/*.{js,json}',
            helpers: [
                './node_modules/handlebars-layouts/index.js',
                './app/templates/helpers/*.js'
            ],
            partials: './app/templates/*.hbs',
            bustCache: true
        }))
        .on('error', notify.onError(error => `Handlebars error: ${error}`))
        .pipe(gulp.dest('.tmp'));
});

[Shannon Moeller]

Could you add the debug flag to the options you're passing to gulp-hb and paste the output for the file that throws, please?

[Oskar]

I reinstalled another dependency of my project (grunticon-lib), which also uses handlebars, and now it works again. Sorry for the trouble.

Here's the log with debug anyway.

~/S/(v3) $ gulp handlebars
[16:23:14] Requiring external module babel-core/register
[16:23:16] Using gulpfile ~/project/gulpfile.babel.js
[16:23:16] Starting 'handlebars'...
[16:23:16] Rendering 'index.html' with...
[16:23:16]      data -> model
[16:23:16]   context -> file model
[16:23:16]   helpers -> block blockHelperMissing content each embed extend helperMissing if log lookup lower unless with
[16:23:16]  partials -> layout nav
[16:23:17] Finished 'handlebars' after 80 ms
~/S/project (v3) $

[Shannon Moeller]

Glad to hear it! Thanks.

[Oskar]

I was a bit too quick ;) Whenever I include the line require('grunticon-lib'); the gulp-hb task fails. Not sure why or how they are related - but both have handlebars as dependencies.

If you have any time to spare I'd appreciate any insights. I made a branch here: https://github.com/oskarrough/rough/blob/fix-handlebars/gulp/handlebars.js

[Shannon Moeller]

I'll need to setup a reduced test case. From the grunticon-lib code, I don't see why there would be a conflict. Both are using version 3 of handlebars. The icon lib doesn't register any helpers or partials so there doesn't seem to be a conflict. Are you using a custom grunticon-lib template?

[Oskar]

No, no custom templates. Actually, I set up a test case and learned that the important part is whether or not gulp-hb is included before or after grunticon-lib. If it's after grunticon-lib, it won't work.

https://github.com/oskarrough/gulp-hb-test

Let me know if I can help!

[Shannon Moeller]

Oh, that's weird. Thanks for the test case! I'll take a look.

[Shannon Moeller]

So, we're getting bit by this: http://justjs.com/posts/singletons-in-node-js-modules-cannot-be-trusted-or-why-you-can-t-just-do-var-foo-require-baz-init

I think the only solution may be to install handlebars as a top-level dependency so that the submodules all reference the same version.

UPDATE: That doesn't work either. I even dropped the use of Babel, but same deal. I'm currently digging through the handlebars.js source to see if there's a way to enforce the instance of handlebars being used inside template().

[Shannon Moeller]

I have a v3 release candidate ready that should address this issue. Are you available to kick the tires?

npm i --save "shannonmoeller/gulp-hb#v3"

[Shannon Moeller]

gulp-hb will now use a unique instance of handlebars to prevent cross-contamination. Breaking change.

Released as v3.0.0.