読者です 読者をやめる 読者になる 読者になる

Express のテンプレートエンジンとして haml + CoffeeScript を使う

Express の標準テンプレートエンジンは jade ですが、あの html の閉じタグを毎回書くのがぼくは好きになれません。
そこで、 haml をテンプレートエンジンとして利用するようにしてみようと思います。


これについては Express のガイドページにもやり方が書いてあります。
http://expressjs.com/guide.html

まず、 hamljs をインストールします。

$ npm install hamljs

そして Express を使うときに設定を行います。

# app.coffee
app = require('express').createServer()
app.register '.haml', require('hamljs')

閉じタグを書かなくてすむのはとてもすばらしいですね!


さて、これで haml を利用できるようになったわけですが、テンプレート中に書く JavaScript 部分も CoffeeScript を使ってお手軽に書けるようにしてみたいと思います。


haml には filter という機能があって、独自にコンパイラを指定できます。
この辺りは rubyhaml でも同じですね。

# app.coffee
app = require('express').createServer()

coffee = require 'coffee-script'
hamljs = require 'hamljs'

hamljs.filters.coffee = (str) ->
  @javascript coffee.compile(str)

app.register '.haml', require('hamljs')

こうしておくと、haml のテンプレート中で CoffeeScript を書けるようになります。

%head
  :coffee
    jQuery ($) ->
      alert "Generated from 'CoffeeScript'!"

すっきりと書けますね!
すばらしい!!