是否有可能通过一个标志,吞咽以不同的方式执行任务?
通常在Gulp任务看起来像这样:
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)); });
是否有可能传递一个命令行标志吞咽(这不是一个任务),并有条件的基础上运行任务? 例如
$ gulp my-task -a 1
然后在我的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不提供任何types的util,但是你可以使用其中的一个命令参数parsing器。 我喜欢yargs
。 应该:
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)); });
你也可以把它和gulp-if
结合起来, gulp-if
有条件地pipe道stream,对开发和生产build设非常有用:
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/')); });
然后用gulp my-js-task
或gulp my-js-task --production
调用。
在我的项目中,我使用以下标志:
gulp styles --theme literature
Gulp gulp.env
提供了一个对象gulp.env
。 它在新版本中被弃用,所以你必须使用gulp-util。 任务如下所示:
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' })); });
环境设置在所有子任务中都可用。 所以我也可以在watch任务上使用这个标志:
gulp watch --theme literature
而我的风格任务也起作用。
Ciao Ralf
这是我发现的一个快速配方:
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
原始参考(不再可用): https : //github.com/gulpjs/gulp/blob/master/docs/recipes/pass-params-from-cli.md
最小化的select
从更新的参考: 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
有一个非常简单的方法可以on/off
不parsing参数的情况下on/off
标志。 gulpfile.js
只是一个像任何其他执行的文件,所以你可以这样做:
var flags = { production: false }; gulp.task('production', function () { flags.production = true; });
gulp-if
有条件地执行一个步骤,可以使用类似gulp-if
东西
gulp.task('build', function () { gulp.src('*.html') .pipe(gulp_if(flags.production, minify_html())) .pipe(gulp.dest('build/')); });
执行gulp build
会产生一个很好的html,而gulp production build
会缩小它。
如果你有一些严格的(有序!)参数,那么你可以简单地通过检查process.argv
来获得它们。
var args = process.argv.slice(2); if (args[0] === "--env" && args[1] === "production");
执行它: gulp --env production
但是,我认为这太严格了,不是防弹的! 所以,我摆弄了一下……最后得到了这个效用函数:
function getArg(key) { var index = process.argv.indexOf(key); var next = process.argv[index + 1]; return (index < 0) ? null : (!next || next[0] === "-") ? true : next; }
它吃一个参数名称,并将在process.argv
search。 如果没有发现它吐出null
。 否则,如果他们没有下一个参数,或者下一个参数是一个命令而不是一个值(我们与短划线不同),则返回true
。 (这是因为密钥存在,但没有任何价值)。 如果之前的所有情况都会失败,那么下一个参数值就是我们所得到的。
> 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
好吧,现在已经足够了…下面是一个简单的使用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")); });
运行它gulp --env production
我构build了一个插件,将参数从命令行注入到任务callback中。
gulp.task('mytask', function (production) { console.log(production); // => true }); // gulp mytask --production
https://github.com/stoeffel/gulp-param
如果有人发现错误或有改进,我很乐意合并PR。
如果你正在使用打字稿( gulpfile.ts
),那么对yargs
(build立在@Caio Cunha的优秀回答https://stackoverflow.com/a/23038290/1019307和上面的其他评论):;
安装
npm install --save-dev yargs typings install dt~yargs --global --save
.ts
文件
将其添加到.ts文件中:
import { argv } from 'yargs'; ... let debug: boolean = argv.debug;
这必须在每个.ts文件中单独完成(甚至是导入到gulpfile.ts/js
的tools/tasks/project
文件)。
跑
gulp build.dev --debug
或者在npm
下通过arg来吞咽:
npm run build.dev -- --debug
从命令行传递参数
// 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')); });
然后运行gulp:
$ gulp scripts --env development
资源
var isProduction = (process.argv.indexOf("production")>-1);
CLI gulp production
调用我的生产任务,并为任何条件设置一个标志。
我们想为不同的环境传递不同的configuration文件 – 一个用于生产,开发和testing。 这是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; }