gulp(npm)に引数を渡したい！

「 ファイルを指定して、gulpを実行したい！ 」となったので、
gulpでファイル名を引数でわたせばいいんじゃないの？と思い、対応していったんですがその時のメモです。

gulpに引数を渡す

基本的に引数は渡せなそうだったので、
minimistを使用することにしました。
こちらは、引数をオブジェクトとして渡してくれる機能になります。

minimistの使い方

gulpfile.js

var gulp = require('gulp'),
    minimist = require('minimist');
var argv = minimist(process.argv.slice(2));
gulp.task('check', function() {
  console.dir(argv);
});

確認方法

gulp

$ gulp check -f HOGE

これで引数を受け取ることができました。

npm run script に引数を渡す

npmは標準で「--」の後ろに引数を渡せます
https://docs.npmjs.com/cli/run-script
こちらを参考に、以下のように修正して $ npm run します。

package.json

// 省略
"scripts": {
  "check": "bundle exec gulp check -f"
},
// 省略

gulpfile.js

var gulp = require('gulp'),
    minimist = require('minimist');
var argv = minimist(process.argv.slice(2));
gulp.task('check', function() {
  console.dir(argv);
});

$ npm run check -- HOGE // 「HOGE」を渡します
[19:15:10] Starting 'check'...
{ _: [ 'check' ], f: 'HOGE' }
[19:15:10] Finished 'check' after 2.27 ms

fにHOGEが入っているのは、
package.jsonのscriptsにあるcheck箇所に固定で
"bundle exec gulp check -f"
と記述してあるからです。

応用

$ npm run check -- target で $ gulp check -f target
を実行したいので下記のように編集していきます。

gulpfile.js

var gulp = require('gulp'),
    process = require('process'), 
    minimist = require('minimist');
var argv = minimist(process.argv.slice(2));

gulp.task('check', function() {
  // argv['f']の値がないときはboolean型のtrueを返すので文字列(引数があったら)だったら処理をすすめるようにします。
  if(argv['f'] === true) { 
    console.log('$ npm run watch -- [filename] // 拡張子無し');
    process.exit(0);
  }
  gulp.watch(['sass/' + argv['f'] + '.scss'], ['sass']);
});
// sassタスクは別途書く

$ npm run check -- style // style.scssを、sassタスク実行します。

これで引数に渡した値によって、タスク内で処理する対象や処理を変更することができました！