gulp 覚え書き

gulp.js

自分用の gulp.js 覚書のメモ。以下の内容は

を大変参考にさせていただきました。

npm install -g gulp

npm init

npm install --save-dev gulp

プロジェクトのルートに gulpfile.js を作成する。

var gulp;

gulp = require('gulp');

gulp.task('default', function() {
  console.log('done!');
});

./src/ 以下の CoffeeScript をコンパイルして、 ./build/js/ 以下に出力するといった場合は以下のようになる。

gulp.task('coffee', function() {
  return gulp.src('./src/*.coffee')
    .pipe(coffee({bare: true})
    .pipe(gulp.dest('./build/js/'))
});

gulp.src で処理を行うフォルダを指定して、pipe でタスクを直列につないでいって、 gulp.dest で出力先を指定する。 gulp.js で利用できる API については以下を参照。

プロジェクトのルートで gulp タスク名 を実行することで、gulp.task の第一引数で指定した同じ名前のタスクが走る。

gulp default

aaa

タスク名を省略した場合は default が実行されるようになっている

gulp

gulp.task(name[, deps], fn)
// gulp.task(タスク名,[並列で実行しておきたいタスク達], タスクの内容);

ストリームを返すかコールバックを呼び出すことで、非同期化してタスクの実行順序を保証できる

gulp.src で生成したストリームを return する

gulp.task('coffee', function() {
  return gulp.src('./src/*.coffee')
    .pipe(coffee({bare: true})
    .pipe(gulp.dest('./build/'))
});

gulp.task('one', function(done) {
  return setTimeout(function(done) {
    console.log('task');
    done();
  }, 1000);
});

プラグインは以下から検索できるので、用途に応じて require して、使う。