以前の記事で、markdownファイルをゴニョゴニョしてjadeに混ぜよう！みたいなことを言ってたのだけど、ちゃんとしたやりかたがあった。

jadeのFilterを使うとmarkdownやless, coffeescriptなどを解釈できる

1
2
3

def my_cool_method(message)
  puts message
end

標準では以下が使えるようになっている。

• :stylus
• :less
• :markdown
• :cdata
• :coffeescript

使うときは、ちゃんと以下のように使うものをインストールしておく

1

`npm install coffee-script`

jade側では

1
2
3
4
5

#mdBlock
  :markdown
    # markdownで見出し1

    文章を書きますね。書いてますよ。書いてるんです。書いてるでしょ？書いてるんです！

と、書くと出力がこんな感じに。

1
2
3
4

<div id="mdBlock">
    <h1>markdownで見出し1</h1>
    <p>文章を書きますね。書いてますよ。書いてるんです。書いてるでしょ？書いてるんです！</p>
</div>  

これはうれしい。

coffeescriptもインライン展開できる

jadeで

1

include /coffee/test.coffee

こうすると、test.coffeeをコンパイルしたうえで、展開されてる

1
2
3
4
5

<script type="text/javascript">
    (function () {
        console.log('うんこ');
    }).call(this);
</script>

jsでPC/スマホ判定リダイレクトを入れるときとかに便利そうだ。

以下、gistです