是否可以将标志传递给 Gulp 以使其以不同的方式运行任务?

2022-08-29 23:36:28

通常在 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(这不是任务),并让它基于此有条件地运行任务?例如

$ gulp my-task -a 1

然后在我的吞噬文件中.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));
});

答案 1

Gulp 没有为此提供任何类型的实用程序,但你可以使用许多命令 args 解析器之一。我喜欢亚格斯。应该是:

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 结合使用,以有条件地管道传输流,这对于开发与生产构建非常有用:

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-taskgulp my-js-task --production


答案 2

编辑

gulp-util已弃用,应避免使用,因此建议改用已使用的 minimistgulp-util

所以我在我的gulpfile中更改了一些行来删除:gulp-util

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

gulp.task('styles', function() {
  return gulp.src(['src/styles/' + (argv.theme || 'main') + '.scss'])
    …
});

源语言

在我的项目中,我使用以下标志:

gulp styles --theme literature

Gulp为此提供了一个对象。它在较新版本中被弃用,因此您必须为此使用gulp-util。任务如下所示:gulp.env

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' }));
});

环境设置在所有子任务中都可用。所以我也可以在监视任务上使用此标志:

gulp watch --theme literature

我的样式任务也有效。

乔拉尔夫