web-dev-qa-db-fra.com

Passer le paramètre à la tâche Gulp

Normalement, nous pouvons exécuter la tâche gulp à partir de la console via quelque chose comme gulp mytask. Y at-il de toute façon que je puisse passer en paramètre pour avaler la tâche? Si possible, veuillez montrer un exemple de la façon dont cela peut être fait.

gulp
172
user1995781

C'est une fonctionnalité que les programmes ne peuvent rester sans. Vous pouvez essayer des jargons.

npm install --save-dev yargs

Vous pouvez l'utiliser comme ceci:

gulp mytask --production --test 1234

Dans le code, par exemple:

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

Pour votre compréhension:

> 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

J'espère que vous pourrez le prendre d'ici.

Il y a un autre plugin que vous pouvez utiliser, minimist. Il existe un autre article où il existe de bons exemples à la fois pour yargs et minimist: ( Est-il possible de passer un drapeau à Gulp pour qu’il exécute des tâches de différentes manières? )

247
Ethan

Si vous voulez éviter d'ajouter des dépendances supplémentaires, j'ai trouvé le process.argv du nœud utile:

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

Donc ce qui suit:

gulp mytask --option 123

devrait afficher:

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

Si vous êtes sûr que le paramètre souhaité est dans la bonne position, les drapeaux ne sont pas nécessaires. ** Utilisez simplement (dans ce cas):

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

MAIS: comme l’option peut ne pas être définie, ou peut être dans une position différente, j’estime qu’une meilleure idée serait quelque chose comme:

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

De cette façon, vous pouvez gérer les variations dans plusieurs options, comme:

//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

** Edit: true pour les scripts de noeuds, mais gulp interprète tout ce qui ne comporte pas de "-" comme un autre nom de tâche. L'utilisation de gulp mytask 123 échouera donc car gulp ne peut pas trouver une tâche appelée '123' .

126
Trevedhek

Passer un paramètre à avaler peut signifier quelques choses:

  • De la ligne de commande au fichier gulp (déjà illustré ici).
  • Du corps principal du script gulpfile.js aux tâches en bloc.
  • D'une tâche à la fois à une autre.

Voici une approche consistant à passer des paramètres du fichier gulp principal à une tâche gulp. En déplaçant la tâche qui a besoin du paramètre vers son propre module et en l'enveloppant dans une fonction (afin qu'un paramètre puisse être passé):

// ./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});

Cela peut s'avérer utile si vous avez beaucoup de tâches à traiter et que vous souhaitez leur transmettre des configurations environnementales pratiques. Je ne sais pas si cela peut fonctionner d'une tâche à l'autre.

18
yuvilio

Il existe une recette de gulp officielle pour cela en utilisant minimiste .

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

Les bases utilisent minimist pour séparer les arguments de la cli et les combiner avec des options connues:

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

Ce qui analyserait quelque chose comme

$ gulp scripts --env development

Plus d'informations complètes dans la recette.

14
RobW

Si vous souhaitez utiliser des paramètres d'environnement et d'autres utilitaires tels que log, vous pouvez utiliser gulp-util

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

La réponse de @ Ethan fonctionnerait complètement. D'après mon expérience, la méthode la plus utilisée consiste à utiliser des variables d'environnement. C'est un moyen standard de configurer des programmes déployés sur des plates-formes d'hébergement (Heroku ou Dokku, par exemple).

Pour transmettre le paramètre à partir de la ligne de commande, procédez comme suit:

Développement: gulp dev

Production: NODE_ENV=production gulp dev

La syntaxe est différente, mais très Unix, et compatible avec Heroku, Dokku, etc.

Vous pouvez accéder à la variable dans votre code à l'adresse process.env.NODE_ENV

MYAPP=something_else gulp dev

mettrait

process.env.MYAPP === 'something_else'

Cette réponse pourrait vous donner d'autres idées.

5
Michael Cole

Voici mon exemple comment je l'utilise. Pour la tâche css/moins. Peut être appliqué pour tous.

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);
});
4
Lynx

Voici une autre manière sans modules supplémentaires:

J'avais besoin de deviner l'environnement à partir du nom de la tâche, j'ai une tâche 'dev' et une tâche 'prod'.

Lorsque je lance gulp prod, il doit être défini sur l’environnement prod. Lorsque je lance gulp dev ou quoi que ce soit d'autre, il doit être défini sur dev environnement.

Pour cela, je vérifie simplement le nom de la tâche en cours:

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

Si vous utilisez gulp with yargs, remarquez ce qui suit:

Si vous avez une tâche 'client' et que vous ne voulez pas utiliser la méthode de construction de yargs dans la vérification des paramètres pour les commandes requises:

.command("customer <place> [language]","Create a customer directory") l'appeler avec:

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

yargs va toujours jeter une erreur, qu'il n'y a pas assez de commandes assignées à l'appel, même si vous l'avez !! -

Essayez et ajoutez seulement un chiffre à la commande (pour le rendre différent du nom de la tâche gulp) ... et cela fonctionnera:

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

Cela est dû au fait que la bouffée semble déclencher la tâche, avant que yargs ne puisse vérifier ce paramètre requis. Cela m'a coûté des heures supplémentaires pour comprendre cela.

J'espère que cela vous aide ..

1
suther

Je sais que je suis en retard pour répondre à cette question mais je voudrais ajouter quelque chose à répondre de @Ethan, la réponse la plus votée et acceptée.

Nous pouvons utiliser yargs pour obtenir le paramètre de ligne de commande. Nous pouvons également ajouter notre propre alias pour certains paramètres, comme suit.

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

Veuillez consulter ce lien pour plus de détails. https://github.com/yargs/yargs/blob/HEAD/docs/api.md

Voici l’utilisation de l’alias comme indiqué dans la documentation de yargs. Nous pouvons également y trouver plus de fonctions yargs et améliorer encore davantage l'expérience de passage en ligne de commande.

.alias (clé, alias)

Définissez les noms de clé comme équivalents de sorte que les mises à jour d'une clé se propagent sous des alias et inversement.

Si vous le souhaitez, .alias () peut prendre un objet qui mappe les clés aux alias. Chaque clé de cet objet doit être la version canonique de l'option et chaque valeur doit être une chaîne ou un tableau de chaînes.

0
Code Spark