はじめてのgulp.js

インストール

まずはグローバルインストール。

npm install -g gulp

次に、プロジェクトフォルダでローカルインストール

npm install --save-dev gulp

グローバルとローカルを両方インストールする必要がある。

タスクの作成

プロジェクトフォルダにgulpfile.jsを作成。
ここにタスクを記述する。

3つのタスクhello,hoge,defaultを登録してみる。

gulpfile.js

var gulp = require('gulp');
gulp.task('hello',function(){
  console.log('hello wolrd!');
});

gulp.task('hoge',function(){
  console.log('hogehoge');
});
gulp.task('default',['hello','hoge']);

helloとhogeは引数に渡した関数を実行する。

defaultは引数に渡した配列で指定されたタスクを実行する。（helloタスクとhogeタスクを指定している)
このように、複数のタスクを実行させることができるが、並列処理されるので 実行順序は保証されない。

タスクの実行

gulp タスク名で実行する

gulp hello
gulp hoge
gulp default

gulpコマンドはタスク名を指定しないで実行すると、defaultという名前のタスクを実行しようとする。よって、defaultタスクの実行にはタスク名は省略可能。

# defaultタスクを実行
gulp

あとは、プロジェクトに応じて好きなタスクを作成していけばよい。
便利なプラグインがあるのでいろいろ探してみるとよい。