Передать параметр в Gulp Task


194

Обычно мы можем запустить задачу gulp из консоли через что-то вроде gulp mytask. Есть ли в любом случае, что я могу передать в параметре для gulp задачи? Если возможно, приведите пример, как это можно сделать.



Ответы:


269

Это особенность программ, без которых не обойтись. Вы можете попробовать ярги .

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?
вини

Если вы используете gulp с yargs, обратите внимание на следующее: Если у вас есть задача 'customer' и вы не хотите использовать сборку yargs в проверке параметров для необходимых команд: command ("customer", "Создать каталог клиента")
suther

Смотрите мой комментарий ниже, если вы хотите использовать встроенную в yargs проверку параметров для требуемых «команд» вместе с
gulp

5
(argv.production === undefined) ? false : true;эквивалентно argv.production !== undefined.
JimmyMcHoover

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
Trevedhek

Я просто хотел проверить флаг --dev, чтобы различать производственную и нижнюю среды. Это делает трюк без добавления дополнительных зависимостей. Спасибо!
b01

1
Для меня gulp myTask --productionрезультаты process.argvравны[pathToNode, pathToGulp, 'myTask', '--production']
Сунг Чо

2
Вероятно, это изменилось, я видел несколько старых примеров с той же разницей. Во всяком случае, вы можете просто отладить его и посмотреть на ваш случай. Это должен быть принятый ответ, поскольку у него нет нулевых зависимостей ..
Хуан,

19

Передача параметра в gulp может означать несколько вещей:

  • Из командной строки в gulpfile (здесь уже приведены примеры).
  • От основной части скрипта gulpfile.js до задач 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

Есть официальный рецепт глотка для этого, используя минималист .

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

Основы используют minimist для разделения аргументов cli и объединения их с известными параметрами:

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

Что бы разобрать что-то вроде

$ gulp scripts --env development

Более полная информация в рецепте.


1
Почему мусор наверху списка и правильное решение на дне не получают голосования? вздох
DDD

14

Если вы хотите использовать параметры среды и другие утилиты, такие как log, вы можете использовать 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-util устарела с 2016 года
valdeci

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он должен быть установлен в среду prod. Когда я бегу gulp devили что-то еще, он должен быть установлен в среду разработки.

Для этого я просто проверяю имя запущенной задачи:

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

2

Если вы используете глоток с яргами, обратите внимание на следующее:

Если у вас есть задача 'customer' и вы не хотите использовать встроенную yargs для проверки параметров на наличие необходимых команд:

.command("customer <place> [language]","Create a customer directory") позвонить с помощью:

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

yargs всегда выдаст ошибку, что на вызов не было назначено достаточно команд, даже если у вас есть !! -

Попробуйте добавить в команду только цифру (чтобы она не совпадала с именем задачи gulp) ... и она будет работать:

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

Это является причиной того, что gulp, кажется, запускает задачу, прежде чем yargs сможет проверить этот требуемый параметр. Мне понадобилось несколько часов, чтобы понять это.

Надеюсь, это поможет вам ..


0

Я знаю, что опоздал, чтобы ответить на этот вопрос, но я хотел бы добавить что-то, чтобы ответить на @Ethan, получивший наибольшее количество голосов и принявший ответ.

Мы можем использовать, yargsчтобы получить параметр командной строки, и с этим мы также можем добавить наш собственный псевдоним для некоторых параметров, таких как follow.

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 () может взять объект, который сопоставляет ключи с псевдонимами. Каждый ключ этого объекта должен быть канонической версией опции, а каждое значение должно быть строкой или массивом строк.


Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.