gulpfileをCoffeeScript等で書く方法
Task Runnerツールのgulpで、
タスクの設定は gulpfile.js
という設定スクリプトを作って書くことになっています。
(任意のファイルを指定する場合は、コマンドライン引数の --gulpfile
オプションで指定します)
Task Runnerツールとして有名なGruntでは、設定ファイルをjs以外にCoffeeScriptをデフォルトでサポートしているため、
オブジェクトの入れ子がたくさんできる gruntfile
をCoffeeScriptで書くという人も多いと思います。
gulpでは、デフォルトでは js
ですが、 --require
オプションを使うことで任意のaltJSを使って、
gulpfile
を書くことが出来るようになっています。
(この場合のデフォルトとは、gulp側に自動的にcoffeeという拡張子をみて何かする処理がないということ)
CoffeeScriptでgulpfileを書く
サンプルは以下に置いてあります。
まずは、必要なnodeモジュールをインストールします(上記のプロジェクトなら既に定義してあるので npm install
するだけ)
npm install --save-dev gulp gulp-coffee coffee-script
次に、設定ファイルをCoffeeScriptで書きます。
gulp = require('gulp')
coffee = require('gulp-coffee')
gulp.task 'coffee', ->
gulp.src('src/**/*.coffee')
.pipe(coffee({bare:true}))
.pipe gulp.dest('app')
gulp.task 'default', ->
gulp.run 'coffee'
この設定ファイルをgulpの設定ファイルと認識させて、defaultタスクを実行したいと思います。
gulpfile.js
の場合は $ gulp
とするだけで実行出来ますが、
gulpfile.coffee
をCoffeeScriptでコンパイルしてから実行させる必要があります。
それを簡単に行うのが、 --require
オプションで、コンパイラとなるNodeのモジュール名をしてします。(coffeescriptの場合は coffee-script
がモジュール名です)
なので、以下のように実行すれば gulpfile.coffee
を設定して読み込んでタスクを実行出来ます。
$ gulp --require coffee-script
毎回指定するのが面倒な場合は alias gulp=gulp --require coffee-script
とか。
これで、coffeescriptで書いた設定ファイルを利用できるようになりますが、
他の手法についてはドキュメントにも書いてあるのでそちらも参照するといいです。
こういうTips的な使い方はrecipesにまとめていってるようなのでそちらも参照するといいです。
仕組み
最初に js
という拡張子についてしか、 gulp側には定義されてないと言いましたが、
gulpfile.coffee
の coffee
という拡張子はどうやって認識してるのでしょうか?
gulp 3.4 では gilefile + 拡張子のリスト にマッチするものを設定ファイルとして認識するようになってます。
function getGulpFile() {
var extensions;
if (require.extensions) {
extensions = Object.keys(require.extensions).join(',');
} else {
extensions = ['.js'];
}
var gulpFile = findup('gulpfile{'+extensions+'}', {cwd: cwd, nocase: true});
return gulpFile;
}
この拡張子のリストは require.extensions
という配列から来てることがわかります。
この require.extensions はnodeにあるグローバルオブジェクト的なもので、ここに .coffee
の文字列が存在すると、
gulpfile.coffee
というファイル名が設定ファイルとして検出出来るようになってます。
.coffee
というのはどこからきてるのかというと、coffee-scriptのnodeモジュール側で定義されています。
何か微妙な感じがしますがそういう仕組みのようです。
お知らせ欄
JavaScript Primerの書籍版がAmazonで購入できます。
JavaScriptに関する最新情報は週一でJSer.infoを更新しています。
GitHub Sponsorsでの支援を募集しています。