我如何 运行 来自两个或多个其他任务的 gulp 任务并通过管道

how do I run a gulp task from two or more other tasks and pass the pipe through

这一定很明显,但我找不到。我想在开发环境和生产环境中使用构建任务用观察者预处理我的 stylus/coffee 文件(这对我们所有人来说不是很常见吗?),并且 运行 还要进行一些缩小和丑化生产中的步骤,但我想分享 DRY

的开发和生产通用的管道步骤

问题是,当我 运行 监视文件的任务时,预处理任务会对所有文件执行此操作,因为它有自己的 gulp.src 语句,其中包括所有手写笔文件。

如何避免在观看时编译所有文件,同时仍将编译任务分开。谢谢

paths = {
    jade: ['www/**/*.jade']
  };

  gulp.task('jade', function() {
    return gulp.src(paths.jade).pipe(jade({
      pretty: true
    })).pipe(gulp.dest('www/')).pipe(browserSync.stream());
  });



 gulp.task('serve', ['jade', 'coffee'], function() {
    browserSync.init({
      server: './www'
    });
    watch(paths.jade, function() {
      return gulp.start(['jade']);
    });
    return gulp.watch('www/**/*.coffee', ['coffee']);
  });

Gulp 中的一件重要事情是 复制管道。如果你想处理你的手写笔文件,它必须是唯一的手写笔管。但是,如果您想在管道中执行不同的步骤,您有多种选择。我建议将 noop() 函数与选择函数结合使用:

var through = require('through2'); // Gulp's stream engine

/** creates an empty pipeline step **/
function noop() {
  return through.obj();
}

/** the isProd variable denotes if we are in
  production mode. If so, we execute the task.
  If not, we pass it through an empty step
  **/
function prod(task) {
  if(isProd) {
    return task;
  } else {
    return noop();
  }
}

gulp.task('stylus', function() {
  return gulp.src(path.styles)
    .pipe(stylus())
    .pipe(prod(minifyCss())) // We just minify in production mode
    .pipe(gulp.dest(path.whatever))
})

至于增量构建(每次迭代只构建更改的文件),最好的方法是使用 gulp-cached 插件:

var cached = require('gulp-cached');

gulp.task('stylus', function() {
  return gulp.src(path.styles)
    .pipe(cached('styles')) // we just pass through the files that have changed
    .pipe(stylus())
    .pipe(prod(minifyCss()))
    .pipe(gulp.dest(path.whatever))
})

此插件将检查内容是否随您完成的每次迭代而更改。

我花了整整一章 Gulp my book, and I found those to be the most suitable ones. For more information on incremental builds, you can also check on my article on that (includes Gulp4): http://fettblog.eu/gulp-4-incremental-builds/

中的不同环境