1

使用 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 %}
4

0 回答 0