Jade - Cargando plantillas desde diferentes directorios

Question

Estoy tratando de trabajar en los videos de pila completa Node.js de Peepcode y parece que están usando una versión anterior de express/jade. No se menciona el uso de bloques/extensiones para renderizar diseños.

La configuración utilizada en la aplicación es tener un archivo /views/layout.jade que se carga para todas las subaplicaciones. Las vistas de las sub-aplicaciones se encuentran en/apps // views.

Mi server.js parece bastante estándar. Express es la versión 3.0.0rc1

require('coffee-script'); 

var express = require('express') 
    , http = require('http') 
    , path = require('path'); 

var app = express(); 

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.logger('dev')); 
    app.use(express.bodyParser()); 
    app.use(express.methodOverride()); 
    app.use(app.router); 
    app.use(express.static(path.join(__dirname, 'public'))); 
}); 

app.configure('development', function(){ 
    app.use(express.errorHandler()); 
}); 

require('./apps/authentication/routes')(app) 

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

Mi archivo de rutas para la sub-aplicación está en/apps/autenticación/rutas

routes.coffee

routes = (app) -> 

    app.get "/login", (req,res) -> 
    res.render "#{__dirname}/views/login", 
     title: "Login" 
     stylesheet: 'login' 

module.exports = routes 

La vista tengo la intención de la prestación de esta.

login.jade

extends layout 

block content 
    form(action='/sessions', method='post') 
    label 
     | Username 
     input(type='text', name='user') 
    label 
     | Password 
     input(type='password', name='password) 
    input(type='submit', name='Submit') 

y finalmente el diseño.

doctype 5 
html 
    head 
    title= title 
    link(rel='stylesheet', href='/stylesheets/#{stylesheet}.css') 
    body 
    block content 

ir a localhost: 3000/login hace esto:

expreso 500 Error: /Users/StevenNunez/code/HotPie/apps/authentication/views/login.jade:1> 1 | extiende el diseño 2 | 3 | bloquear contenido 4 | form (action = '/ sessions', method = 'post') ENOENT, no existe ningún archivo o directorio '/Users/StevenNunez/code/HotPie/apps/authentication/views/layout.jade'

Mi estructura de carpetas:

. 
├── ' 
├── apps 
│   └── authentication 
│    ├── routes.coffee 
│    └── views 
│     └── login.jade 
├── package.json 
├── public 
├── server.js 
└── views 
    ├── index.jade 
    └── layout.jade 

Gracias por su tiempo.

Answer 1

Parece como si tuviera que acaba de dar a la ruta relativa en la llamada extends.

extends ../../../views/layout 

block content 
    form(action='/sessions', method='post') 
    label 
     | Username 
     input(type='text', name='user') 
    label 
     | Password 
     input(type='password', name='password') 
    input(type='submit', name='Submit') 

no tenía para establecer app.set('view options',{layout:false});

Answer 2

Está intentando utilizar dos métodos de representación ... El primer diseño que amplía el diseño y el segundo es el contenido del bloque. Al usar un diseño, está extendiendo automáticamente el archivo de diseño en la carpeta login.jade.

No es necesario utilizar extends y no puede usar la frase block, pero si desea usar extends tiene que deshabilitar el diseño.

Añadir esto a la aplicación:

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

después

app.set('view engine', 'jade'); 

y extender los archivos al igual que la disposición se extiende:

layout.jade

doctype 5 
html 
    head 
    title= title 
    link(rel='stylesheet', href='/stylesheets/#{stylesheet}.css') 
    body 
    block content 

login.jade

extends layout 

block content 
    form(action='/sessions', method='post') 
    label 
     | Username 
     input(type='text', name='user') 
    label 
     | Password 
     input(type='password', name='password) 
    input(type='submit', name='Submit') 

El archivo de inicio de sesión tiene que estar en el mismo directorio.Si desea llamar a otro diseño puede utilizar el directorio de la siguiente manera:

appDirectory 
    views 
    layout 
    otherViews 
    login 

login.jade

extends ../views/layout  
block content 
    form(action='/sessions', method='post') 
    label 
     | Username 
     input(type='text', name='user') 
    label 
     | Password 
     input(type='password', name='password) 
    input(type='submit', name='Submit') 

Answer 3

Puede utilizar variables __dirname para conectar puntos de vista de otros directorios.

Ejemplo:

app.get('/otherurl/' , function(req, res){ 
    res.render(__dirname + '/../other_project/views/index') 
});