Changing the Handlebars extensions in NodeJs

Question

Handlebars template's filename extension

Hi, my templates files got the extension .handlebars and I want to change it to .hbs

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

const app = express();

app.engine('handlebars', exphbs({defaultLayout: 'index'}));
app.set('view engine', 'handlebars');

when changing handlebars to hbs and renaming the files, errors appear. The files are not found anymore.

What is missing?

[How to change handlebars extension for express?](https://stackoverflow.com/questions/34580640/how-to-change-handlebars-extension-for-express) — Yves Kipondo, Nov 28 '17 at 10:13

score 2 · Accepted Answer · answered Nov 28 '17 at 10:16

Try setting the following properties

const exphbs  = require('express-handlebars');
const handlebars = exphbs.create({
  // layoutsDir: path.join(__dirname, 'app/views/layouts'),
  // partialsDir: path.join(__dirname, 'app/views/partials'),
  defaultLayout: 'index',
  extname: 'hbs'
});

app.engine('hbs', handlebars.engine);
app.set('view engine', '.hbs');

score 2 · Answer 2 · answered Nov 28 '17 at 10:42

Change your code something like this:

`

const express = require('express');
var app = express();
const hbs = require('express-handlebars');
app.set('views', path.join(__dirname, 'views'));
app.engine('hbs', hbs({extname : 'hbs', defaultLayout: 'index', layoutsDir: __dirname+'/views/layouts'}));
app.set('view engine', 'hbs');

Change your file's extentions from .hanlebars to .hbs and put your index.hbs file inside path/to/project/views/layouts and rest of the .hbs file should remain in path/to/project/views/.

this is really annoying, the main file `index` should be placed above the other template files instead of below — peterHasemann, Nov 28 '17 at 10:46

Changing the Handlebars extensions in NodeJs

2 Answers2