É possível passar um sinalizador para o Gulp para que ele execute tarefas de maneiras diferentes?

Normalmente, as tarefas do Gulp são assim:

gulp.task('my-task', function() { return gulp.src(options.SCSS_SOURCE) .pipe(sass({style:'nested'})) .pipe(autoprefixer('last 10 version')) .pipe(concat('style.css')) .pipe(gulp.dest(options.SCSS_DEST)); }); 

É possível passar um sinalizador de linha de comando para gulp (que não é uma tarefa) e tê-lo executar tarefas condicionalmente com base nisso? Por exemplo

 $ gulp my-task -a 1 

E então no meu gulpfile.js:

 gulp.task('my-task', function() { if (a == 1) { var source = options.SCSS_SOURCE; } else { var source = options.OTHER_SOURCE; } return gulp.src(source) .pipe(sass({style:'nested'})) .pipe(autoprefixer('last 10 version')) .pipe(concat('style.css')) .pipe(gulp.dest(options.SCSS_DEST)); }); 

Gulp não oferece nenhum tipo de util para isso, mas você pode usar um dos muitos parsers args de comando. Eu gosto de yargs . Deveria estar:

 var argv = require('yargs').argv; gulp.task('my-task', function() { return gulp.src(argv.a == 1 ? options.SCSS_SOURCE : options.OTHER_SOURCE) .pipe(sass({style:'nested'})) .pipe(autoprefixer('last 10 version')) .pipe(concat('style.css')) .pipe(gulp.dest(options.SCSS_DEST)); }); 

Você também pode combiná-lo com gulp-if para condicionalmente canalizar o stream, muito útil para o desenvolvimento de desenvolvimento vs prod:

 var argv = require('yargs').argv, gulpif = require('gulp-if'), rename = require('gulp-rename'), uglify = require('gulp-uglify'); gulp.task('my-js-task', function() { gulp.src('src/**/*.js') .pipe(concat('out.js')) .pipe(gulpif(argv.production, uglify())) .pipe(gulpif(argv.production, rename({suffix: '.min'}))) .pipe(gulp.dest('dist/')); }); 

E chame com gulp my-js-task ou gulp my-js-task --production .

No meu projeto, uso o seguinte sinalizador:

 gulp styles --theme literature 

Gulp oferece um object gulp.env para isso. Está obsoleto em versões mais recentes, então você deve usar o gulp-util para isso. As tarefas são assim:

 var util = require('gulp-util'); gulp.task('styles', function() { return gulp.src(['src/styles/' + (util.env.theme ? util.env.theme : 'main') + '.scss']) .pipe(compass({ config_file: './config.rb', sass : 'src/styles', css : 'dist/styles', style : 'expanded' })) .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'ff 17', 'opera 12.1', 'ios 6', 'android 4')) .pipe(livereload(server)) .pipe(gulp.dest('dist/styles')) .pipe(notify({ message: 'Styles task complete' })); }); 

A configuração do ambiente está disponível durante todas as subtarefas. Então eu posso usar este sinalizador na tarefa de observação também:

 gulp watch --theme literature 

E minha tarefa de estilos também funciona.

Ciao Ralf

Aqui está uma receita rápida que encontrei:

gulpfile.js

 var gulp = require('gulp'); // npm install gulp yargs gulp-if gulp-uglify var args = require('yargs').argv; var gulpif = require('gulp-if'); var uglify = require('gulp-uglify'); var isProduction = args.env === 'production'; gulp.task('scripts', function() { return gulp.src('**/*.js') .pipe(gulpif(isProduction, uglify())) // only minify if production .pipe(gulp.dest('dist')); }); 

CLI

 gulp scripts --env production 

Original Ref (não está mais disponível): https://github.com/gulpjs/gulp/blob/master/docs/recipes/pass-params-from-cli.md

Alternativa com minimista

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

gulpfile.js

 // npm install --save-dev gulp gulp-if gulp-uglify minimist var gulp = require('gulp'); var gulpif = require('gulp-if'); var uglify = require('gulp-uglify'); var minimist = require('minimist'); var knownOptions = { string: 'env', default: { env: process.env.NODE_ENV || 'production' } }; var options = minimist(process.argv.slice(2), knownOptions); gulp.task('scripts', function() { return gulp.src('**/*.js') .pipe(gulpif(options.env === 'production', uglify())) // only minify if production .pipe(gulp.dest('dist')); }); 

CLI

 gulp scripts --env production 

Existe uma maneira muito simples de ativar on/off bandeiras sem analisar os argumentos. gulpfile.js é apenas um arquivo que é executado como qualquer outro, então você pode fazer:

 var flags = { production: false }; gulp.task('production', function () { flags.production = true; }); 

E use algo como gulp-if para executar condicionalmente um passo

 gulp.task('build', function () { gulp.src('*.html') .pipe(gulp_if(flags.production, minify_html())) .pipe(gulp.dest('build/')); }); 

Executar o gulp build produzirá um bom html, enquanto o gulp production build irá minimizá-lo.

Se você tem alguns argumentos estritos (ordenados!), Então você pode obtê-los simplesmente verificando process.argv .

 var args = process.argv.slice(2); if (args[0] === "--env" && args[1] === "production"); 

Execute-o: gulp --env production

… no entanto, acho que isso é muito rigoroso e não à prova de balas! Então, eu brinquei um pouco … e acabei com essa function de utilidade:

 function getArg(key) { var index = process.argv.indexOf(key); var next = process.argv[index + 1]; return (index < 0) ? null : (!next || next[0] === "-") ? true : next; } 

Ele come um nome de argumento e procurará isso em process.argv . Se nada foi encontrado, o valor será null . Caso contrário, se o seu não for o próximo argumento ou o próximo argumento for um comando e não um valor (diferimos com um traço) true será retornado. (Isso é porque a chave existe, mas simplesmente não há valor). Se todos os casos anteriores falharem, o próximo valor de argumento é o que obtemos.

> gulp watch --foo --bar 1337 -boom "Foo isn't equal to bar."

 getArg("--foo") // => true getArg("--bar") // => "1337" getArg("-boom") // => "Foo isn't equal to bar." getArg("--404") // => null 

Ok, o suficiente por agora ... Aqui está um exemplo simples usando gulp :

 var gulp = require("gulp"); var sass = require("gulp-sass"); var rename = require("gulp-rename"); var env = getArg("--env"); gulp.task("styles", function () { return gulp.src("./index.scss") .pipe(sass({ style: env === "production" ? "compressed" : "nested" })) .pipe(rename({ extname: env === "production" ? ".min.css" : ".css" })) .pipe(gulp.dest("./build")); }); 

Execute gulp --env production

Eu construí um plugin para injetar parâmetros da linha de comando no retorno de chamada da tarefa.

 gulp.task('mytask', function (production) { console.log(production); // => true }); // gulp mytask --production 

https://github.com/stoeffel/gulp-param

Se alguém encontrar um bug ou tiver uma melhoria, ficarei feliz em mesclar os PRs.

E se você estiver usando typescript ( gulpfile.ts ), faça isso para yargs (com base na excelente resposta do @Caio Cunha https://stackoverflow.com/a/23038290/1019307 e outros comentários acima):

Instalar

 npm install --save-dev yargs typings install dt~yargs --global --save 

arquivos .ts

Adicione isto aos arquivos .ts:

 import { argv } from 'yargs'; ... let debug: boolean = argv.debug; 

Isto tem que ser feito individualmente em cada arquivo .ts (até as tools/tasks/project arquivos de tools/tasks/project que são importados para o gulpfile.ts/js ).

Corre

 gulp build.dev --debug 

Ou sob npm passe o arg para engolir:

 npm run build.dev -- --debug 

Passar argumentos da linha de comando

 // npm install --save-dev gulp gulp-if gulp-uglify minimist var gulp = require('gulp'); var gulpif = require('gulp-if'); var uglify = require('gulp-uglify'); var minimist = require('minimist'); var knownOptions = { string: 'env', default: { env: process.env.NODE_ENV || 'production' } }; var options = minimist(process.argv.slice(2), knownOptions); gulp.task('scripts', function() { return gulp.src('**/*.js') .pipe(gulpif(options.env === 'production', uglify())) // only minify in production .pipe(gulp.dest('dist')); }); 

Em seguida, execute gulp com:

 $ gulp scripts --env development 

Fonte

 var isProduction = (process.argv.indexOf("production")>-1); 

A gulp production CLI chama minha tarefa de produção e define um sinalizador para quaisquer condicionais.

Queríamos passar um arquivo de configuração diferente para ambientes diferentes – um para produção , desenvolvimento e teste . Este é o código no arquivo gulp:

 //passing in flag to gulp to set environment //var env = gutil.env.env; if (typeof gutil.env.env === 'string') { process.env.NODE_ENV = gutil.env.env; } 
Intereting Posts