Макеты шаблонов Jade не работают в сочетании с Node.js

Я пытаюсь создать простой сервер в Node.js, который использует шаблоны Jade и макеты. По какой-то причине он будет загружать только шаблон, а не макет.

Вот что у меня есть:

main.js

var express = require('express');

var app = express.createServer();

app.set('views', __dirname + '/views'); 
app.set('view engine','jade');
app.set('view options', {
 layout: true
});

app.get('/', function(req,res) {
res.render('index', { title: 'My site' });
});

app.listen(4000);

Как вы видите, макеты включены. Я пробовал ссылаться на него непосредственно в методе рендеринга, но это не имеет значения. Стоит также отметить, что "title:" Мой сайт "также не работает.

index.jade

h2 Hello!
p I really hope this is working now

lo.jade

!!! 5
html
  head
    title Why won't this work
  body
    h1 I AM A LAYOUT
    div= body

Здесь мой npm list:

├─┬ [email protected] 
│ ├── [email protected] 
│ ├─┬ [email protected] 
│ │ ├── [email protected] 
│ │ ├── [email protected] 
│ │ ├── [email protected] 
│ │ └── [email protected] 
│ ├── [email protected] 
│ ├── [email protected] 
│ └── [email protected] 
└─┬ [email protected] 
  ├── [email protected] 
  └── [email protected]

Любые идеи о том, почему это не работает?

Ответы

Ответ 1

Я думаю, что вы делаете макет неправильно. Я делаю это так:

Я установил макет в значение false:

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

В файле layout.jade:

doctype 5
html(lang="en")
    head
        title MySite #{title}
body
    block mainContent

И на отображаемой странице (скажем: home.jade), которая включает переменную (содержимое)

extends layout

block mainContent
    h1 This is home
    p= content

У вас может быть другая страница, основанная на (расширении) одного и того же макета (other.jade) с разными переменными (пользователем)

extends layout

block mainContent
    h1 Oh look ! Another page
    p= user

И назовите их следующим образом:

app.get('/', function(req, res) {
    res.render('home', { 
        title : "Home",
        content: "Some Home page content"
    });
});

app.get('/anotherPage', function(req, res) {
    res.render('other', { 
        title : "Other page",
        user: "Here goes a user name"
    });
});

Ответ 2

Это, кажется, изменение последней версии Express/jade.

Express:  '3.0.0alpha1': '2012-04-18T22:47:46.812Z'
Jade:     '0.25.0':      '2012-04-18T22:40:01.162Z'

Поймал меня тоже!

Несколько других вещей изменились, - потребовалось некоторое время, чтобы разобраться.

К сожалению, Express и Jade не особенно хорошо документированы, и многие из примеров, которые вы найдете в Интернете, устарели.

Арно дал новый способ использовать макет сейчас. Я не знаю, что старый способ работает вообще. Конечно, когда я пытался что-то вроде dtyon, и он больше не работает.

Итак, проверьте, какую версию Express и Jade вы установили с помощью команд:

npm show express dist.tarball
npm show jade dist.tarball

Надеюсь, это поможет. J.

Ответ 3

Насколько я могу судить, по умолчанию файл макета следует называть "layout.jade". Однако, если вы хотите другое имя, вы можете использовать опцию подсказки "layout" при рендеринге:

res.render('index', { layout: 'lo', title: 'My site' });

Я также предполагаю, что файл макета lo.jade находится в корневом каталоге /views/.

Ответ 4

У меня была такая же проблема, так что люди знают, что новый способ работы макетов в express/jade заключается в том, что макет уже расширен по умолчанию, и ваш блок автоматически передается как переменная body

например.

index.jade

/* This will be passed as "body" no need for "block body" */
h1= title
p Welcome to #{title}

layout.jade

doctype
html
  head
    meta(charset='utf-8')
  body
    /* body is output here using != which outputs variable without escaping characters */
    section!= body