シンプルで飽きていなかったんだけどまたブログのテーマを少し変えようと思ってmakotokw2015テーマを作り始めた。makotokw2014はgruntでビルドしていたんだけどここ1,2年でgulpが追い抜いた感があるのでgulpに書きなおした。
npmのパッケージで言うと以下のように切り替え。
| Grunt Package | Gulp Package |
|---|---|
| grunt-ci | gulp |
| grunt | gulp |
| load-grunt-tasks | gulp-load-plugins |
| grunt-bower-task | main-bower-files, gulp-bower-normalize |
| grunt-contrib-compass | gulp-compass |
| grunt-contrib-jshint | gulp-jshint |
| grunt-contrib-uglify | gulp-concat, gulp-uglify |
| grunt-contrib-watch | gulp, browser-sync |
| grunt-wp-i18n, grunt-exec | gulp-shell |
具体的な置き換えについてはファイルを見るのが早いと思う。
makotokw2014/Gruntfile.js → makotokw2015/gulpfile.js
Gulpのタスクを調べると非推奨のプラグインを使っている古い記事に遭遇することがあるので blackList と比べながら採用するプラグインを吟味した。gulp-shellはgulp-execと同じということでブラックリストに入っているのだがGruntのgrunt-execでやっていたexitCodeでエラーを無視する処理を引き継ぎたかったのでgulp-execの利用を諦めた。
機能的には置き換えはできたんだけどプラグインの差分でいうと以下のようなことがあった。
Gruntのgrunt-contrib-uglifyでconcatも出来たんだけどGulpはpipeでつなぐのがお作法なのでgulp-concat→gulp-uglifyと使った。
Gulpではwatch APIがあり、プラグインは不要。ただGruntのgrunt-contrib-watchのLiveReloadの機能を使っていたので今回はbrowser-syncを使うことにした。
WordPressの翻訳ファイルのビルドをしてくれるGruntのgrunt-wp-i18nに相当するGulpのpluginは見つけられなかった。おとなしく gulp-shell を使って直接gettextを叩くようにした。
grunt-wp-i18nに相当するものは無かったがGulpのプラグインも充実してきており、移行はそんなに大変じゃなかった。ただし、動いているものを移行するのは面倒だが。
基本的に速くなることはあまり期待していないがpipeで渡す分、各プラグインの責任範囲(in/out)が明確になりやすくそのあたりがタスクの設計やgulpfile.jsの可読性にもつながってくると思う。
wp-gfm