GruntでJade使う場合にbodyclassをつける方法

More than 1 year has passed since last update.

そもそもbodyclassがどうなのって話はおいといて、何だかんだで便利よね、bodyclass。

でもjadeって「このdiv以下をごにょごにょする」のはblock使えば楽なんだけどbodyみたいなかなり上の方をごにょごにょするのは面倒だなぁな印象があって今までそういうのはできないもんだと思うようにしてた。してたんだけどやっぱりできた、jadeすげー。

変数用のblockを定義

各ページで使用する変数だけを記述するためのblockを用意して、使いたいページのjadeファイルにだけblockを記述すれば良い。超簡単じゃん。

## _layout.jade

//- 各ページ毎に設定する変数ブロック
block vars
  -var bodyclass = "default";

doctype html
html
  head
    meta(charset='UTF-8')
〜
  body(class="#{bodyblass}")

## index.jade

block vars
  -var bodyclass = "top";

これでカンペキ。Jadeはblockを上手く使うのがポイントだなーと思いました、まる。

Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account log in.