Executar tarefas Gulp em série

Tive um problema hoje para reduzir e concatenar para uma biblioteca CSS, pois queria que as tarefas fossem executadas em sequência.

Esta receita do Gulp para executar tarefas em série nos dá um bom exemplo de retorno de fluxos de tarefas do Gulp, permitindo que as tarefas sejam executadas uma ou outra.

No exemplo, os modelos e estilos serão processados ​​em paralelo. A tarefa de limpeza terá a garantia de ser concluída antes de qualquer início.

var gulp = require('gulp');
var del = require('del');

gulp.task('clean', function(cb) {
    del(['output'], cb);
});

gulp.task('templates', ['clean'], function() {
    var stream = gulp.src(['src/templates/*.hbs'])            
        .pipe(gulp.dest('output/templates/'));
    return stream;
});

gulp.task('styles', ['clean'], function() {
    var stream = gulp.src(['src/styles/app.less'])
        .pipe(gulp.dest('output/css/app.css'));
    return stream;
});

gulp.task('build', ['templates', 'styles']);        
gulp.task('default', ['build']);

É assim que as tarefas dependem no Gulp. Neste exemplo, a tarefa dois depende da tarefa um, portanto, a execução Gulp twoexecutaria ambas as tarefas

gulp.task('one', function(cb) {
    // do stuff
});

gulp.task('two', ['one'], function() {
  // task 'one' is done now
});

Eu usei isso em um Gulpfile simples para uma biblioteca CSS recentemente

var gulp = require('gulp'),
  less = require('gulp-less'),
  concatCss = require('gulp-concat-css'),
  minify = require('gulp-minify-css'),
  rename = require('gulp-rename');

gulp.task('less', function() {
  var stream = gulp.src('less/*.less')
    .pipe(less())
    .pipe(gulp.dest('./css'));
  return stream;
});

gulp.task('concatCss', ['less'], function (cb) {
  var stream = gulp.src('css/**/*.css')
    .pipe(concatCss("styles.css"))
    .pipe(gulp.dest('.'));
  return stream;
});

gulp.task('minify', ['concatCss'], function (cb) {
  var stream = gulp.src('styles.css')
    .pipe(minify({keepBreaks: true}))
    .pipe(rename({
      suffix: '.min'
     }))
     .pipe(gulp.dest('./'));
  return stream;
});

// default gulp task
gulp.task('default', ['minify'], function() {
});

O Gulpfile tem less concatCsse minifytarefas e executando a tarefa padrão eu inicio a tarefa minify que depende de concat, e concat depende de menos, então essas tarefas serão executadas na ordem de cima para baixo.