gulpとvinyl。gulp.srcを使わずgulpしてみる。

  • 20
    Like
  • 0
    Comment
More than 1 year has passed since last update.

この記事はプログラマのためのGulp入門の一部です。

とりあえず、先にまとめておくと、「 GulpはVinylのストリーム 」だ。

Gulpの処理はストリームを繋いで作成する。
このストリームの中を流れるのはVinylオブジェクトです。
Vinylオブジェクトはファイルを抽象化したもので、ファイルシステム内のファイルも表現できるし、S3にあるオブジェクトも表現できたりするようだ。

NodeJSのユーザでないプログラマがGulpで遊ぼうとするとストリームを扱いなれていなくて苦戦することがわかった。

Gulpの処理部分の例はgulp.srcからはじまり、gulp.destで終わることが多い。

gulp.srcはglobをつかって複数のファイルを選択し、dulp.destでは「選択した複数のファイルをなにやら処理したもの」が流れてくるので、流れきたファイルを指定したディレクトリに保存する。

今回はgulp.srcを使わずにVinylオブジェクトを自分でつくってみた。

中身がhogeのhoge.txtと中身がgoroのgorot.txtをmapで作成して、それを入力にしてglup.destに繋いでいる。

npm install vinyl event-stream gulp
sample.js
var Vinyl = require('vinyl');
var es = require('event-stream');
var gulp = require('gulp');

files = ["hoge","goro"].map(function (n) { 
  return new Vinyl({path:n+".txt",contents: new Buffer(n+"\n")});
});

es.readArray(files).pipe(gulp.dest("."));
$ cat hoge.txt
hoge
$ cat goro.txt
goro

filesはVinylオブジェクトの配列で、event-streamのredayArrayを利用すると、配列をストリームに変換することができる。

Vinylのストリームが、Viniylの配列のようなものであることが確認できた。