ちょっと前に riot.js に, 実行時(runtime) でも jade 使えるようにする pull req 投げてたんですが無事にマージ & リリースされましたー!!

ってことで紹介したいと思います. 対応 version は v2.3~ です.

何が変わったの？

巷では Browserify やら Webpack やら流行ってるみたいですが, 個人的にはそういったローカルでごにょごにょする系は好きではないです.

なので, riot.js の埋め込みタグ実装

<script type='riot/tag'>  
<tag>  
  <h2>タグだよー</h2>
</tag>  
</script>  

に template 属性を指定できるようにしました.

<script src='http://cdnjs.cloudflare.com/ajax/libs/jade/1.11.0/jade.js'></script>  
<script type='riot/tag' template='jade'>  
tag  
  h2 タグだよー
</script>  

jade.js を読み込むのも忘れずに!

Runstant Demo

デモです. 下の方で jade を使ってタグを定義しています. 実際にタグの中身が html に変換されて展開されているのがわかるかと思います.

Riot.js は設計思想がコンパクトかつ柔軟なので使ってて気持ちが良いです♪