Jade - 从不同目录加载模板

Posted 2023-03-03

【中文标题】Jade - 从不同目录加载模板

【英文标题】：Jade - Loading templates from different directories

【发布时间】：2012-07-25 09:40:18

【问题描述】：

我正在尝试处理 Peepcode 的 Node.js 全栈视频，似乎他们使用的是旧版本的 express/jade。没有提到使用块/扩展来渲染布局。

应用程序中使用的设置是有一个为所有子应用程序加载的 /views/layout.jade 文件。子应用的视图位于 /apps//views。

我的 server.js 看起来很标准。 Express 是 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'));
);

我的子应用路由文件在 /apps/authentication/routes

routes.coffee

routes = (app) ->

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

module.exports = routes

我打算为此渲染的视图。

登录.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')

最后是布局。

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

转到 localhost:3000/login 会呈现以下内容：

快递 500 错误：/Users/StevenNunez/code/HotPie/apps/authentication/views/login.jade:1 > 1|扩展布局 2| 3|阻止内容 4| form(action='/sessions', method='post') ENOENT，没有这样的文件或目录 '/Users/StevenNunez/code/HotPie/apps/authentication/views/layout.jade'

我的文件夹结构：

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

感谢您的宝贵时间。

【参考方案1】：

看来我必须在 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')

我不必设置app.set('view options',layout:false);

【讨论】：

好的......它工作正常......但设置应用程序，因为它是使用扩展方法的正确方法

我正在学习相同的教程并遇到了同样的问题。出于某种原因，我不习惯使用“扩展 ../../../views/layout”。有没有替代方案？

太棒了。正是我需要的！

为了避免../../../views/layout，你可以设置jade的basedir配置变量：app.locals.basedir = __dirname + '/views';，然后你应该在你的视图中使用'absolute'（绝对来自basedir）路径，例如：extends /layout

谢谢 有问题。这个解决方案修复了它。

【参考方案2】：

您可以使用变量__dirname 连接来自其他目录的视图。

例子：

app.get('/otherurl/' , (req, res) =>  
  res.render(`$__dirname/../other_project/views/index`) 
);

【参考方案3】：

您正在尝试使用两种渲染方法... 扩展布局的第一个布局，第二个是块内容。 使用布局时，您会自动扩展 login.jade 文件夹中的布局文件。

extends不是必须的，你不能使用block语句，但是如果你想使用extends你必须禁用布局。

将此添加到应用程序：

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

之后

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

并像布局扩展一样扩展文件：

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')

登录文件必须在同一个目录中。如果你想调用其他布局，你可以像这样使用目录：

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')

【讨论】：

谢谢。什么是“正确”的方法或渲染？由于我刚刚进入 node/express/jade，我想尝试遵循社区制定的约定。