Register assemble handlebars-helpers with Express handlebars

Question

I had a look at this post but it does not come up with a solution: Register Assemble Handlebars Helpers

I want to register all the helpers in https://github.com/assemble/handlebars-helpers to my Express 4 application running express-handlebars.

So far I've tried this but the helpers are not getting registered:

var express = require('express')
    , app = express()
    , exphbs = require('express-handlebars');

var hbs = exphbs.create({
    extname: '.hbs',
    defaultLayout: 'default',
    layoutsDir: './lib/templates/layouts',
    partialsDir: './lib/templates/partials'
    helpers: require('handlebars-helpers') // Not registering correctly
});

How does this library work? I'm probably doing it wrong. Are you supposed to register one at a time or can you load the all helpers?

score 3 · Answer 1 · answered Mar 10 '17 at 09:45

This working for me:

In app.js:

var exphbs = require('express-handlebars');

var hbs = exphbs.create({
    extname: '.hbs',
    defaultLayout: 'default',
    layoutsDir: './lib/templates/layouts',
    partialsDir: './lib/templates/partials'
    helpers: require('handlebars-helpers').helpers
});

app.engine('hbs', hbs.engine);

In handlebars-helpers.js:

var register = function (Handlebars) {
    var helpers = {
        formatCurrency: function (currency) {
            return currency.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,");
        },
        format_date: function (date, format) {
            return moment(date).format(format);
        },
        ...
    };

    if (Handlebars && typeof Handlebars.registerHelper === "function") {
        for (var prop in helpers) {
            Handlebars.registerHelper(prop, helpers[prop]);
        }
    } else {
        return helpers;
    }

};

module.exports.register = register;
module.exports.helpers = register(null);

In views:

{{formatCurrency settings.phoneNumber}}

score 0 · Accepted Answer · answered Jan 27 '16 at 18:02

0

Try this:

var express = require('express')
    , app = express()
    , exphbs = require('express-handlebars')
    , hbsHelpers = require('handlebars-helpers');

var hbs = exphbs.create({
    //code...
});
hbsHelpers.register(hbs.handlebars, {});

answered Jan 27 '16 at 18:02

Macgyver Martins

96
1
4

Thanks for your reply @Macgyver Martins. This worked perfectly. Weird that this would not be stated in the documentation as so many are using express-handlebars. – ChrisRich Jan 28 '16 at 01:06
the [dev branch](https://github.com/assemble/handlebars-helpers/tree/dev) is 143 commits ahead of master. I recommend taking a look at that branch. we'll be merging to master in the next few days – jonschlinkert Jan 28 '16 at 07:50

lhrec_106 · Answer 3 · 2018-07-09T05:19:20.733

Just want to add a few ideas since this question is already 3 years. I'm using Express 4 as well with express-handlebars (Also nodejs 8.11 LTS). In the app.js (created by express generator).

const exphbs = require('express-handlebars');
const hbsHelpers = require('handlebars-helpers')();
const hbs = exphbs.create({
    // Specify helpers which are only registered on this instance.
    defaultLayout: 'main',
    extname: '.hbs',
    helpers: hbsHelpers,
});
app.engine('hbs', hbs.engine);
app.set('view engine', 'hbs');

Tried both above answers but couldn't get them working. But noticed that in the Usage section of handlebars-helpers documentation It says: The main export returns a function that needs to be called to expose the object of helpers.

The express-handlebars create function also support the helpers parameter as an object, such as:

const hbs = exphbs.create({
    // Specify helpers which are only registered on this instance.
    defaultLayout: 'main',
    extname: '.hbs',
    helpers: {
        tsnumber: () => { return Math.round((new Date()).getTime() / 1000); },
    },
});

As you can see in this example, I defined one helper called tsnumber (returns Unix style timestamp), and what helpers get is just an object.

To further extend this functionality by combining the helper I defined (tsnumber) and the express-handlebars, we can use Object.assign.

The new structure will be:

config/hbsHelper.js
node_modules/
app.js

The config directory is a folder I created to combine two libraries. The content of config/hbsHelper.js is:

const hbsDefaultHelpers = require('handlebars-helpers')();
const extra = {
    tsnumber: () => { return Math.round((new Date()).getTime() / 1000); },
};

const merged = Object.assign(extra, hbsDefaultHelpers);
module.exports = merged;

Then in the app.js

const exphbs = require('express-handlebars');
const hbsHelpers = require('./config/hbsHelpers');
const hbs = exphbs.create({
    defaultLayout: 'main',
    extname: '.hbs',
    helpers: hbsHelpers,
});

score 0 · Answer 4 · answered Jan 25 '20 at 23:26

0

Solution for hbs:

const hbs = require('hbs');
const app = express();
app.set('view engine', 'hbs');

hbs.registerHelper(require('handlebars-helpers')()); // register extra helpers

answered Jan 25 '20 at 23:26

JayDi

1,037
15
24

Register assemble handlebars-helpers with Express handlebars

4 Answers4