使用 Swig 和 Express,我已经习惯了命名路由,因此我可以在视图和重定向中引用它们,而无需直接使用 URL。
我找到了扩展 Express 的好模块node-reversable-router,这似乎可以很好地完成工作,但它的帮助 url() 方法/函数似乎没有正确地暴露于视图(Swig),因此,我不能在那里使用它。
Express 抛出“500 TypeError: Cannot read property 'login' of undefined”(我认为 url('login') 助手)。
有没有人用过这个路由器和 Jade 以外的模板引擎?
这是我的 app.js 文件:
var express = require('express'),
cons = require('consolidate'),
routes = require('./routes'),
login = require('./routes/login'),
http = require('http'),
swig = require('swig'),
Router = require('reversable-router'),
path = require('path');
var app = express();
var router = new Router();
router.extendExpress(app);
router.registerAppHelpers(app);
swig.init({
allowErrors: true,
cache: false,
encoding: 'utf8',
root: __dirname + '/views/'
});
// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/views/');
app.set('view engine', 'html');
app.set('view options', {
layout: false
});
app.locals({
assets: '/assets'
});
app.engine('html', cons.swig);
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(app.locals.assets, express.static(__dirname + '/public'));
// development only
if ('development' == app.get('env')) {
app.use(express.errorHandler());
}
app.get('/', 'home', routes.index);
app.get('/login', 'login', login.index);
console.log(app._router.build('login'));
// above outputs '/login' correctly
http.createServer(app).listen(app.get('port'), function(){
console.log('Express server listening on port ' + app.get('port'));
});
这是我的 routes/login.js (股票标准 Express 生成):
exports.index = function(req, res){
res.render('login.html');
};
这是我的 view/login.html - url() 助手在表单操作中大约一半:
{% extends "base.html" %}
{% block htmlextra %}class="login-bg"{% endblock %}
{% block title %}Login{% endblock %}
{% block customcss %}
<!-- this page specific styles -->
<link rel="stylesheet" href="{{ assets }}/css/page/login.css" type="text/css" media="screen" />
{% endblock %}
{% block content %}
<div class="row-fluid login-wrapper">
<a href="/">
<img class="logo" src="{{ assets }}/img/logo-white.png">
</a>
<div class="span4 box">
<div class="content-wrap">
<h6>Log in</h6>
<form action="{{ url('login') }}" method="post">
<input type="text" name="email" id="email" class="span12" placeholder="E-mail address">
<input type="password" name="password" id="password" class="span12" placeholder="Your password">
<a href="/login/reset" class="forgot">Forgot password?</a>
<div class="remember">
<input type="checkbox" name="remember_me" id="remember_me" value="y">
<label for="remember_me">Remember me</label>
</div>
<input class="btn-glow primary login" type="submit" name="submit" value="Log in">
</form>
</div>
</div>
</div>
<!-- scripts -->
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="/assets/js/bootstrap.min.js"></script>
<script src="/assets/js/theme.js"></script>
{% endblock %}