GulpでTaskに引数を使う

Gulpで、タスクをより便利にしたいとき、引数が使いたくなります。
こんな感じです。

gulp build --dev

これは、npmのモジュール、「minimist」を使うとできます。

npm i minimist
var minimist = require("minimist");
gulp.task("build", function() {
  var env = minimist(process.argv.slice(2));
  if (env.dev) {
    // --devが入っているとき
  } else {
    // 通常時
  }
});

–と-の違い

次のようなコマンドにしてみます

gulp build -dev

--dev ではなくて、 -dev を使ってみました。

こうするとどうでしょう。 env 変数の中を見てみます。

d、e、v オプションに分かれている
d、e、v オプションに分かれている

d、e、vに分かれています。つまり、

gulp build -d -e -v

とやったのと同じになるらしいです(今知った)!

ちなみに --dev でやると・・

devオプションになっています!!

参考

JavaScript - gulp.jsのコマンドライン引数で、環境別にminify条件を切り替える - Qiita
フロントエンド開発効率化のため、この度初めてタスクランナーを使ってみました。最近はGruntよりgulpの方が盛り上がってるようなのでgulpを選択。javascriptの開発をし...

Gulpでtsify+watchify

Qiitaにもかきました。

Gulpでtsify+watchify - Qiita
TypeScriptでBrowserifyが使える、 (https://www.npmjs.com/package/tsify)を知ったのですが、 ビルドの時間が遅いし、毎回「gulp XXX」って打つのが大変な...

TypeScriptでBrowserifyが使える、 tsifyを知ったのですが、

ビルドの時間が遅いし、毎回「gulp XXX」って打つのが大変なので、

watchifyと一緒に使えないかな・・・と思いました。

次のようなgulpfile.jsを作りました。

  • gulp watchify-tsifyと実行する。
  • ./ts/a.ts./ts/b.tsを監視する。
  • watchifyでupdateが発生するたびに、runBundle()を呼び出す。
  • b.pluginでtsifyを読み込み、js/all.jsを出力する。

参考

Gulp + browserify + watchify + gulp-sass で自動高速コンパイル環境
Gulp とはGulp は Web 制作に関するいろいろな作業を自動化するためのツールです。Sass のコンパイルや Gulp の使用には node.js や Sass などのインストールが必要なの...