Geek Answers Handbook

Express not find / use layout

I am trying to use express and render layout.jade, my directory tree is pretty standard.

├── apps │  └── fridge_face │  ├── routes.coffee │  └── views | └── index.jade ├── server.js └── views ├── layout.jade └── stylesheets └── style.styl

In my routes. Coffee, when I do index.jade all the words are fine, but the layout is not displayed. I tried moving the layout to apps/fridge_face/views/ but it failed.

I did not create a layout configuration.

Here is my

layout.jade

 doctype 5 html head title 'What is up' link(rel='stylesheet', href='/stylesheets/style.css') body != body

routes.coffee

 routes = (app) -> app.get '/', (req, res) -> Word.once 'wordsFetched', (params) -> res.render "#{__dirname}/views/index", layout: true words: params.map (word) -> word.word Word.getWords() module.exports = routes

server.js config

 app.configure(function(){ app.set('port', process.env.PORT || 3000); app.set('views', __dirname + '/views'); app.set('view engine', 'jade'); app.use(express.favicon()); app.use(express.bodyParser()); app.use(express.methodOverride()); app.use(app.router); app.use(express['static'](__dirname + '/public')); });

As you can see, nothing that could or could make the layout not display ... what I'm doing wrong, how to get express to find my layout

Edit

I know that I am making this question very long, but adding some changes. First

When I delete != From layouts in both directories, nothing changes. My view is still displayed without a layout.

When i add

 app.set('view options', { layout: false });

and then explicitly display my layout in my view with

 layout: "#{__dirname}/views/layout" # OR layout: "layout" # OR layout: true

Nothing happens and the view is rendered without a layout ...

+4
source share
4 answers

You are using outdated code with a new express version. Please see http://github.com/visionmedia/jade for a new use of the template system.

+1
source

As someone said above, you are using version 3.0, which got rid of the layout and particulars, and allows the template engine to handle this. Here is the answer via wiki migration:

"To return layout functionality using EJS, you can use express-partials or ejs-locals."

(from https://github.com/visionmedia/express/wiki/Migrating-from-2.x-to-3.x )

In the end, I used partial expression expressions, and it worked exactly the same as in their example. I was not able to post a link to ejs-locals, because so far I have not enough reputation, but you can find it on the wiki.

+6
source

Try explicitly specifying the path to your layout file when calling render . Here is an example in express documents:

 res.render('page', { layout: __dirname + '/../../mylayout.jade' });

I assume that there is different logic in express / jade depending on whether the view name is unqualified or specified as the path to the file system.

0
source

If the layout does not work, you can try with partial, I use ejs:

 app.get('/', function(req,res){ res.render('layout.ejs', { layout:false, locals : { body: '../apps/index.ejs' , name : "Daniel" }}); });

And in layout.ejs:

 <html> ... <%-partial(body)%> <html>

In index.ejs:

 <h1>Hola</h1> <%=name%>
0
source

More articles:


All Articles