gulp v4.0を眺めてみた

gulpfileをES6に置き換える必要があり、何気にgulpの情報追っていると、
そろそろv4.0がリリースされそうなのでざっくりと眺めてみた。

gulpfileをES6で書く

まず、本来の目的だったこの件、v3.9ですでに対応されていた。

以下の条件であれば利用可能のようだった。

  • gulp v3.9以上
  • gulpfile.jsをgulpfile.babel.jsとする
  • babel-core をインストールすること

内部的にはbabelで変換しているようだ。

続いて、v4.0のCAHNGELOGも眺めてみた。

gulp4.0をインストール

cliの変更点

--tasks-json と --verify オプションが追加されてる。

–task-json はタスクをjson形式で出力する。

–verify はpluginsがpackage.jsonを参照しているかチェックする。

APIの変更点

大きな変更点はタスク処理機構が、orchestrator から undertaker に変更される点だった。

orchestratorではタスクの同期制御サポートされてないが、undertakerで使うことでタスクの同期処理などが簡単に解決できるようになる。

処理機構の変更のため、APIも大きく変更されている。

gulp.taskはこれまで引数にgulp.task(name[, deps], fn)となっていたが、gulp.task([name,] fn)と依存タスクを指定するdepsがなくなった。

src、dest、watch、symlinkはgulpのclassを使用しているが、
それ以外はundertakerのメソッドをcallしている。

追加されたAPIは

gulp.parallel、gulp.series、gulp.tree、gulp.registry、gulp.lastRunとなる。

gulp.parallel

これまではrunSequenceなどを使っていたTaskの並列化を行うことができる。

gulp.series

こちらはTaskを直列化できる。

gulp.tree

タスクの依存性をtreeで返す。内部的にはを呼んでいる。optionはundertakerと同じ。

gulp.registry

カスタムタスクを登録する。

例えば、別ファイルに分割してあるタスクをrequireして、registryを使って登録することで、
読み込んだタスクを使えるようになる。

これまでファイルを分割した際は、require-dirなどでファイルを読込んでいたのが、v4.0からはrequireしてregistryで行うようになり、直感的に扱える感じになる。

例えば以下のようにタスクを別ファイルに作成している場合

reqistryで登録することで使用できる。

gulp.lastRun

タスクの完了した時間をUNIX TIMESTAM(millisecond)で返す。

ということで、ざっくり見て行ったがバージョン4.0から非同期処理まわりがpluginなしで行えるようになる。
v4.0がいつリリースされるのかちょっとわからないが、必要あであれば先にundertakerを使っておくようにすると良さそう。

参考サイト
gulp 4
Building with Gulp 3 and 4 (Part 2: Gulp’s anatomy)