Jake Schievink
Jake Schievink

Reputation: 409

Ejs-partial problems with express3 layouts not working

I just found out that express 3 breaks ejs layout functionality so im trying to write some code using https://github.com/publicclass/express-partials which is supposed to re add layout functionality into express, however the <%- body %> tag in my layout file is never replaced by the specified ejs file no matter how much I try Heres my app.js

var express = require('express')
, partials = require('express-partials');
var mainscreen = require('./routes/mainscreen');

var user = require('./routes/user');
var http = require('http');
var path = require('path');

var app = module.exports = express();

// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(express.cookieParser('your secret here'));
app.use(express.session());
app.use(app.router);
app.use(partials());
app.use(express.static(path.join(__dirname, 'public')));
// development only
if ('development' == app.get('env')) {
  app.use(express.errorHandler());
}
app.get('/', mainscreen.mainscreen);
app.get('/users', user.list);

http.createServer(app).listen(app.get('port'), function(){
  console.log('Express server listening on port ' + app.get('port'));
});

Here's my route

exports.mainscreen = function(req, res, next){
  res.render('index.ejs', { 
                        title:'Title',
                        titleinfobar: 'Title',
                        accountinfobar: 'Not signed in',
                        bodycontent: 'Body of the doc'});

layout.ejs

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
        <%- body %>     
  </body>               
</html>  

and index.ejs

<div class="head">
        <div class="col-big"><div id="righttitle"><%=titleinfobar %></div></div>
        <div class="col-small"><div id="lefttitle"><%=accountinfobar %></div></div>
</div>
<div class="contentbody">
        <div id="content">
                <%= bodycontent %>
        </div>          
</div>  

Upvotes: 0

Views: 1135

Answers (1)

matth
matth

Reputation: 6279

After tinkering around a bit, app.use(partials()); needs to be placed before app.use(app.router);, otherwise, layout.ejs is not loaded.

Upvotes: 2

Related Questions