第4章-模板引擎Jade和Handlebars-4.6.Express.js中Jade和Handlebars的用法

默認情況下，Express.js 4.x 和 3.x可以使用提供給res.render方法的模板擴展，也可以使用通過view engine設置的默認擴展，去調用模板庫裏的require方法和__express方法。換句話說，Express.js是在外部實例化模板引擎庫的，該庫需要有__express方法。

當模板引擎庫不提供__express方法，也不提供有參數(path、options、callback)的類似方法時，建議你用Consolidate.js

一、這裏有一個Express.js 4 中Consolidate.js快速入門的例子(Express 版本4.2.0、Consolidate版本0.10.0)：

package.json文件

{
  "name": "consolidate-express",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "express": "4.2.0",
    "swig": "1.3.2",
    "consolidate": "0.10.0"
  }
}

app.js文件

var express = require('express'),
  cons = require('consolidate'),
  app = express()

app.engine('html', cons.swig)


app.set('view engine', 'html')
app.set('views', __dirname + '/views')

var platforms = [
  { name: 'node' },
  { name: 'ruby' },
  { name: 'python' }
]

app.get('/', function(req, res){
  res.render('index', {
    title: 'Consolidate This'
  })
})

app.get('/platforms', function(req, res){
  res.render('platforms', {
    title: 'Platforms',
    platforms: platforms
  })
})

app.listen(3000)
console.log('Express server listening on port 3000')

index.html文件

<h1>{{ title }}</h1>
<a href="/platforms">platforms</a>

platforms.html文件
<h1>{{ title }}</h1>
<ul>
{% for platform in platforms %}
  <li{% if loop.first %} class="first"{% endif %}>
    {{ platform.name }}
  </li>
{% endfor %}
</ul>

======================華麗麗的分割線==========================================

二、Jade和Express.js

Jade是兼容Express.js的，事實上，Jade就是Express.js的默認模板引擎。所以要在Express.js中使用Jade，只需安裝模板引擎模塊jade，然後設置view engine即可。

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

注：如果使用命令行工具$express ,你可以給引擎增加一個選項，比如給EJS加選項-e，給Hogan加選項-H。這將會自動把EJS或Hogan添加到新項目中。如果沒有任何選項，express-generator(版本4.0.0-4.2.0)將會使用Jade

在路由文件中，我們可以調用模板，如：views/page.jade（文件夾views的名字是Express.js的另一個默認值，可以用view setting重寫）：

app.get('/page', function(req, res, next){
    //動態獲得數據
    res.render('page', data);
});

如果不指定views engine，那麼擴展必須顯式地傳遞給

res.render()：
res.render('page.jade', data);

三、Handlebars和Express.js

與Jade相反，Handlebars庫沒有__express方法，但是可以通過一些選項讓Handlebars在Express.js下工作：
1.consolidate：Express.js模板引擎庫的一個神器，如之前描述的
2.hbs：Handlebars的開發庫
3.express-Handlebars：這個模板是3.x的，同時在Express.js 4下也能良好的運行

在Express.js中使用hbs：

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

如果想要換成另一個擴展，比如html，

...
app.set('view engine', 'html');
pp.engine('html', require('hbs').__express);
...

Express3-handlebars方法的用法如下：

...
app.engine('handlebars', exphbs({defaultLayout: 'main'}));
app.set('view engine', 'handlebars');
...