2014このブログはブログシステムにJekyllを採用しています。Jekyllは自動でページ生成する機能をもっていますが、今回はGruntからJekyllのページ生成を行う方法について試してみようと思います。JekyllをGrunt経由でビルドする理由JekyllをGrunt経由でビルドする理由は、CSSやJSのビルドとJekyllのビルド一本化するとプロセスが一つ減る。記事執筆とデザイン変更のタスクランナーを分ける必要がなくなるからです。逆にデメリットとしてはGruntの監視範囲が広がることによりマシン負荷が高くなるということです。このブログの様な個人ブログ規模であれば記事も少ないでしょうしCSSもさして複雑でもないと思われるので、実作業に支障をきたすということは考えにくく、無視していいレベルだと思います。Ver.1.4.2やり方grunt-jekyllを使うという選択肢もありますが、気分的にもう少し独立させたかったのでGruntからshellをたたく形にしました。ファイルの内容は下記の通りです(package.json)。}}Gruntからshellを叩くためのモジュール(grunt-shell-spawn)と、後は定番のモジュールを読み込みます。nameの所は任意なのでご随意にどうぞ。続いてGrunt.jsを記述します。だいたい下記のような感じです。'compass:dev']);};タスクはシンプルに、shell:jekyllとcompass:devで構成します。将来的にはcompass:productionでも作ってminifyなどが入ればいいかなと。CSSについてはcompassでビルドされたらそのまま_site/cssに入るようにします。そこでトップ階層のCSSフォルダはJekyllのwatch対象から外さねば無限ループに入ってしまうため_config.ymlのexcludeにcssを入れています。_config.ymlについてはexcludeにGruntfile.jsとpackage.jsonを入れておしまいです。['node_modules','Gruntfile.js','package.json']あとがき今回はJekyllを使ってデザインと執筆する上で最低限のGruntタスクを登録しました。これを使い、不足があれば今後追記していきます。参考までに、今回たまたま見つけたjekyll+Grunt構成におけるサンプルGrunt.jsがあったので紹介しておきます。DoeWeb会社に勤務するデザイナーです。普段はデザインを担当していますが、ここではデザイン、プログラミング、インフラなど興味の赴くままに幅広く書いています。DoeWeb会社に勤務するデザイナーです。普段はデザインを担当していますが、ここではデザイン、プログラミング、インフラなど興味の赴くままに幅広く書いています。