Question

我需要运行两个gulp任务，一个用于js，一个用于css。我需要它们以不同的方式运行build-dev（不缩小）和build-prod（缩小）。

为此，我删除了js和css的任务的缩小和gulp.dest部分，而是将gulp.src返回到任务build-prod或{{ 1}}。这两项任务build-dev或build-prod现在负责以不同方式操纵build-dev和js任务。

如何将任务“css”返回gulp.src或build-prod以继续管道？

注意：因为它是一个流，似乎我在最后一个管道完成该任务后返回流，然后因为它是异步的，为什么我不能在{{1返回？

build-dev

Answer 1

为什么不在多个地方打电话？

function cssTask() {
  return gulp.src('css/**.css')
    .pipe(autoprefixer('last 10 version'))
    .pipe(concatCss('main.css'));
}

gulp.task('css', function () {
  return cssTask();
});

gulp.task('build-prod', function () {
  cssTask()
    .pipe(minifycss())
    .pipe(gulp.dest('build/css'));
});

gulp.task('build-dev', function () {
  cssTask()
    .pipe(gulp.dest('build/css'));
});

Answer 2

最好的方法是使用gulp条件：.pipe(gulpif(isProduction, minifycss()))

Gulp If是一种很好的方式。

let isProduction = false;
...
gulp.task('css', function() {
    return gulp.src('css/**.css')
        .pipe(autoprefixer('last 10 version'))
        .pipe(concatCss('main.css'))
        .pipe(gulpif(isProduction, minifycss())) // conditional
        .pipe(gulp.dest('build/css'));
});

gulp.task('build-prod', function() {
    isProduction = true;
    gulp.run('css');
});

gulp.task('build-dev', function() {
    isProduction = false;
    gulp.run('css');
});

返回

2 个答案: