Gulpタスクにパラメーターを渡す


194

通常、コンソールからgulpタスクを実行できますgulp mytask。とにかくパラメーターをgulpタスクに渡すことができますか?可能であれば、例を示してください。



回答:


269

これは、プログラムが欠かせない機能です。yargsを試すことができます。

npm install --save-dev yargs

次のように使用できます。

gulp mytask --production --test 1234

コードでは、例えば:

var argv = require('yargs').argv;
var isProduction = (argv.production === undefined) ? false : true;

あなたの理解のために:

> gulp watch
console.log(argv.production === undefined);  <-- true
console.log(argv.test === undefined);        <-- true

> gulp watch --production
console.log(argv.production === undefined);  <-- false
console.log(argv.production);                <-- true
console.log(argv.test === undefined);        <-- true
console.log(argv.test);                      <-- undefined

> gulp watch --production --test 1234
console.log(argv.production === undefined);  <-- false
console.log(argv.production);                <-- true
console.log(argv.test === undefined);        <-- false
console.log(argv.test);                      <-- 1234

あなたがここからそれを取ることができることを願っています。

ミニミストが使用できる別のプラグインがあります。yargsとminimistの両方の良い例がある別の投稿があります:(フラグをGulp に渡して、さまざまな方法でタスクを実行させることは可能ですか?


13
本当によく書かれた答え、例をありがとう!
アレンライス

どのようにJavaScriptでこれにアクセスしますか?
vini 2016年

yargsでgulpを使用する場合は、次のことに注意してください。タスク 'customer'があり、yargsビルドを使用したくない場合は、必要なコマンドのパラメーターチェック:command( "customer"、 "Create a customer directory")
suther

必要な「コマンド」のyargs組み込みパラメーターチェックをgulpと一緒に使用する場合は、以下の私のコメントを参照してください:stackoverflow.com/a/41412558/1256697
suther

5
(argv.production === undefined) ? false : true;と同等 argv.production !== undefinedです。
CJStuart 2017

136

余分な依存関係の追加を避けたい場合は、ノードprocess.argvが便利であることがわかりました。

gulp.task('mytask', function() {
    console.log(process.argv);
});

したがって、次のようになります。

gulp mytask --option 123

表示する必要があります:

[ 'node', 'path/to/gulp.js', 'mytask', '--option', '123']

目的のパラメーターが正しい位置にあることが確実な場合、フラグは必要ありません。**(この場合)だけを使用します。

var option = process.argv[4]; //set to '123'

しかし、オプションが設定されていないか、別の位置にある可能性があるため、より良いアイデアは次のようになると思います:

var option, i = process.argv.indexOf("--option");
if(i>-1) {
    option = process.argv[i+1];
}

これにより、次のような複数のオプションのバリエーションを処理できます。

//task should still find 'option' variable in all cases
gulp mytask --newoption somestuff --option 123
gulp mytask --option 123 --newoption somestuff
gulp mytask --flag --option 123

** 編集:ノードスクリプトの場合はtrueですが、gulpは、先頭に「-」がないものを別のタスク名として解釈します。したがってgulp mytask 123、gulpは「123」というタスクを見つけることができないため、使用は失敗します。


1
「var option、i = process、argv.indexOf( "-option");」にタイプミスがあります。私はそれがproccess.argvであるべきだと思います。
Luis Paulo Lohmann、2015年

ああ、そうすべきです。修正。ありがとう@luis
Trevedhek

--devフラグを確認したかっただけなので、本番環境とそれより下位の環境を区別できました。これは余分な依存関係を追加することなくトリックを行います。感謝!
b01 '30 / 10/30

1
私にとって、gulp myTask --production結果はprocess.argvに等しい[pathToNode, pathToGulp, 'myTask', '--production']
宋チョー

2
それはおそらく変わった、私は同じ違いを持ついくつかの古い例を見てきました。とにかく、あなたはそれをデバッグしてあなたのケースを見ることができます。それがゼロの依存関係..持っているので、これは受け入れ答えなければなりません
フアンの

19

パラメータをgulpに渡すと、いくつかのことが起こります。

  • コマンドラインからgulpfile(すでにここで例示)へ。
  • gulpfile.jsスクリプトの本体からgulpタスクまで。
  • あるgulpタスクから別のgulpタスクへ。

メインgulpfileからgulpタスクにパラメーターを渡す方法を次に示します。パラメータを必要とするタスクをそれ自身のモジュールに移動し、それを関数にラップします(そのため、パラメータを渡すことができます)。

// ./gulp-tasks/my-neat-task.js file
module.exports = function(opts){

  opts.gulp.task('my-neat-task', function(){
      console.log( 'the value is ' + opts.value );
  });

};
//main gulpfile.js file

//...do some work to figure out a value called val...
var val = 'some value';

//pass that value as a parameter to the 'my-neat-task' gulp task
require('./gulp-tasks/my-neat-task.js')({ gulp: gulp, value: val});

これは、大量のタスクがあり、それらにいくつかの便利な環境設定を渡したい場合に便利です。あるタスクと別のタスクの間で機能するかどうかはわかりません。


16

ミニミストを使用してこれを行うための公式のgulpレシピがあります。

https://github.com/gulpjs/gulp/blob/master/docs/recipes/pass-arguments-from-cli.md

基本はミニミストを使用してcli引数を分離し、それらを既知のオプションと組み合わせます。

var options = minimist(process.argv.slice(2), knownOptions);

のようなものを解析します

$ gulp scripts --env development

レシピのより完全な情報。


1
リストの一番上のゴミと一番下の適切なソリューションが賛成されないのはなぜですか?ため息
DDD

14

ログなどの環境パラメータやその他のユーティリティを使用する場合は、gulp-utilを使用できます。

/* 
  $npm install gulp-util --save-dev
  $gulp --varName 123
*/
var util = require('gulp-util');
util.log(util.env.varName);

更新

gulp-utilは非推奨になりました。代わりにミニミストを使用できます。

var argv = require('minimist')(process.argv.slice(2));
console.dir(argv);

1
gulp

5

@イーサンの答えは完全に機能します。私の経験から、より多くのノードの方法は環境変数を使用することです。これは、ホスティングプラットフォーム(HerokuやDokkuなど)にデプロイされたプログラムを構成する標準的な方法です。

コマンドラインからパラメーターを渡すには、次のようにします。

開発: gulp dev

製造: NODE_ENV=production gulp dev

構文は異なりますが、非常にUnixであり、Heroku、Dokkuなどと互換性があります。

コードで変数にアクセスできます process.env.NODE_ENV

MYAPP=something_else gulp dev

設定します

process.env.MYAPP === 'something_else'

この答えはあなたにいくつかの他のアイデアを与えるかもしれません。


4

これが私の使い方のサンプルです。css / lessタスクの場合。すべてに適用できます。

var cssTask = function (options) {
  var minifyCSS = require('gulp-minify-css'),
    less = require('gulp-less'),
    src = cssDependencies;

  src.push(codePath + '**/*.less');

  var run = function () {
    var start = Date.now();

    console.log('Start building CSS/LESS bundle');

    gulp.src(src)
      .pipe(gulpif(options.devBuild, plumber({
        errorHandler: onError
      })))
      .pipe(concat('main.css'))
      .pipe(less())
      .pipe(gulpif(options.minify, minifyCSS()))
      .pipe(gulp.dest(buildPath + 'css'))
      .pipe(gulpif(options.devBuild, browserSync.reload({stream:true})))
      .pipe(notify(function () {
        console.log('END CSS/LESS built in ' + (Date.now() - start) + 'ms');
      }));
  };

  run();

  if (options.watch) {
    gulp.watch(src, run);
  }
};

gulp.task('dev', function () {
  var options = {
    devBuild: true,
    minify: false,
    watch: false
  };

  cssTask (options);
});

3

追加のモジュールを使わない別の方法を次に示します。

タスク名から環境を推測する必要がありました。「dev」タスクと「prod」タスクがあります。

実行するgulp prodと、製品環境に設定する必要があります。私が実行するときなどはgulp dev、開発環境に設定する必要があります。

そのために、実行中のタスク名を確認するだけです。

devEnv = process.argv[process.argv.length-1] !== 'prod';

2

yargsでgulpを使用する場合、以下注意してください。

タスク 'customer'があり、必要なコマンドのパラメーターチェックでyargsビルドを使用したくない場合:

.command("customer <place> [language]","Create a customer directory") それを呼び出す:

gulp customer --customer Bob --place Chicago --language english

yargsは常にエラーをスローします。たとえ持っていても、十分な数のコマンドが呼び出しに割り当てられていません。—

それを試してみて、コマンドに数字だけを追加してください(それがgulp-task名と等しくないようにするために)...そしてそれはうまくいきます:

.command("customer1 <place> [language]","Create a customer directory")

これは、yargsがこの必須パラメーターをチェックできるようになる前に、gulpがタスクをトリガーしているようです。これを理解するには、何時間もかかりました。

これがお役に立てば幸いです。


0

私はこの質問に答えるのが遅いことを知っていますが、投票して受け入れられた最高の回答である@Ethanの回答に何かを追加したいと思います。

を使用yargsしてコマンドラインパラメーターを取得できます。これにより、次のようないくつかのパラメーターに独自のエイリアスを追加することもできます。

var args = require('yargs')
    .alias('r', 'release')
    .alias('d', 'develop')
    .default('release', false)
    .argv;

詳細については、このリンクを参照してください。 https://github.com/yargs/yargs/blob/HEAD/docs/api.md

以下は、のドキュメントに記載されているエイリアスの使用ですyargs。また、yargsそこでより多くの機能を見つけることができ、コマンドラインの受け渡しのエクスペリエンスをさらに向上させることができます。

.alias(キー、エイリアス)

鍵の名前を同等に設定すると、鍵の更新がエイリアスに反映され、その逆も同様です。

オプションで、.alias()は、キーをエイリアスにマップするオブジェクトを取ることができます。このオブジェクトの各キーはオプションの正規バージョンである必要があり、各値は文字列または文字列の配列である必要があります。


弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.