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 %}