Express ignoring views directory

Question

I have set up a config file to store settings like application path, cookie secret and the like for my express app. The problem is it seems to be ignoring my view path directory setting.

config.js:

...
exports.server = {
    port: 3000,
    cookie_secret: ".....",
    path: "/var/www/onmynode-dev/"
}
...

app.js:

...
app.set('views', path.join(config.server.path, 'views'));
app.set('view engine', 'html');
app.engine('html', require('express3-handlebars')({defaultLayout: "default.html"}));
...

The route is set up like this:

app.get('/', routes.index);

The view is called from the request as follows:

exports.index = function(req, res){
    res.render('index');
};

console.log of app object (var app = express();) at the very end of my app.js file.

...
settings: 
{ 'x-powered-by': true,
 etag: true,
 env: 'development',
 'subdomain offset': 2,
 view: [Function: View],
 views: '/var/www/onmynode-dev/views',
 'jsonp callback name': 'callback',
 'json spaces': 2,
 port: 3000,
 'view engine': 'html' 
},
...

So it looks like the view is being set correctly but on running the app and loading a page we get the following:

500 Error: ENOENT, open '/home/user/views/layouts/default.html'

So it appears to be using the __dirname variable regardless of how I have set things up. Question is how do I debug/fix this issue?

Answer 1

Shot in the dark, but I just read the express3-handlebars docs.

Layouts

A layout is simply a Handlebars template with a {{{body}}} placeholder. Usually it will be an HTML page wrapper into which views will be rendered.

This view engine adds back the concept of "layout", which was removed in Express 3.x. It can be configured with a path to the layouts directory, by default it's set to "views/layouts/".

There are two ways to set a default layout: configuring the view engine's defaultLayout property, or setting Express locals app.locals.layout.

The layout into which a view should be rendered can be overridden per-request by assigning a different value to the layout request local. The following will render the "home" view with no layout:

 app.get('/', function (req, res, next) { res.render('home', {layout: false}); }); 

Perhaps it refers to __dirname+'/views' and ignores what you set in the config.

Try adding {layout: false} like the above code. If it works, then that is your issue.

Continual reading led me to find that you can change where handlebars looks for its layouts. You can add a layoutsDir to the configuration like you did with defaultLayout and set it to the same directory as your Express views:

var hbConfig = {
    layoutsDir: path.join(app.settings.views, "layouts"), 
    defaultLayout: "default.html"
} 
app.engine('html', require('express3-handlebars')(hbConfig));

Answer 2

try this:

app.set('view engine', 'html');
app.engine('html', require('express3-handlebars')({
  defaultLayout: path.join(config.server.path, "views/layouts/default.html"),
  layoutsDir: path.join(config.server.path, "views/layouts"),
  partialsDir: path.join(config.server.path, "views/partials")
}));
app.set('views', path.join(config.server.path, 'views'));

Of course, you should put default.html in the views/layouts/ directory.

Answer 3

Handlebar seems to not care about the views property of express, so either you need to define app.locals.layout ( http://expressjs.com/api.html#app.locals ) or then set the absolute path to your handlebars config object's defaultLayout property.

https://www.npmjs.org/package/express3-handlebars