Gulp.js compiti eseguiti in ordine specifico blocco

Question

Utilizzando gulp.js Ho tre compiti (uglify, buildHTML, rmRevManifest) mi piacerebbe correre come parte di un compito generazione del padre. Il codice che ho funziona, eccetto che esegue le attività in parallelo (vale a dire l'ordine non viene mantenuto). Come posso bloccare il task e non eseguire il prossimo fino a quando il precedente termina?

I.E. in questo momento l'ordine di esecuzione ritorna come:

[11:50:17] gulp-notify: [Gulp notification] Deleted 'rev-manifest.json'. 
[11:50:17] gulp-notify: [Gulp notification] Created 'build/index.html'. 
[11:50:17] gulp-notify: [Gulp notification] Uglified JavaScript. 

Le questioni di ordine, e uglify dovrebbe eseguire prima, poi buildHTML, e, infine, rmRevManifest.

gulp.task('build', ['uglify', 'buildHTML', 'rmRevManifest'], function(cb) { 
}); 

gulp.task('uglify', function(cb) { 
    gulp.src('client/js/source/**/*.js') 
     .pipe(concat('app')) 
     .pipe(ngmin()) 
     .pipe(uglify()) 
     .pipe(rev()) 
     .pipe(rename({ 
      extname: ".min.js" 
     })) 
     .pipe(gulp.dest('client/js')) 
     .pipe(rev.manifest()) 
     .pipe(gulp.dest('client/js')) 
     .pipe(notify('Uglified JavaScript.')); 
}); 

gulp.task('buildHTML', function(cb) { 
    gulp.src('client/views/index.html') 
     .pipe(replace(/app\-[a-fA-F0-9]\.min\.js/, 'app-.min.js')) 
     .pipe(gulp.dest('client/build')) 
     .pipe(notify('Created \'build/index.html\'.')); 
}); 

gulp.task('rmRevManifest', function(cb) { 
    gulp.src('client/js/rev-manifest.json', { read: false }) 
     .pipe(rimraf()) 
     .pipe(notify('Deleted \'rev-manifest.json\'.')); 
}); 

Answer 1

La vera risposta: è necessario impostare le dipendenze che richiedono l'esecuzione delle altre attività.

La risposta facile: c'è un modulo npm per fare esattamente quello che ti serve chiamato run sequence.

Answer 2

var runSequence = require('run-sequence'); 

gulp.task('build', function(cb) { 
    runSequence('uglify', 
       'buildHTML', 
       'rmRevManifest', 
       cb); 
}); 

    gulp.task('uglify', function() { 
     return gulp.src('client/js/source/**/*.js') 
       .pipe(concat('app')) 
       .pipe(ngmin()) 
       .pipe(uglify()) 
       .pipe(rev()) 
       .pipe(rename({ 
        extname: ".min.js" 
       })) 
       .pipe(gulp.dest('client/js')) 
       .pipe(rev.manifest()) 
       .pipe(gulp.dest('client/js')); 
    }); 

    gulp.task('buildHTML', function() { 
     var revManifest = require('./client/js/rev-manifest.json'); 

     return gulp.src('client/views/index.html') 
       .pipe(replace(/app\-[a-fA-F0-9]\.min\.js/, 'app-' + revManifest.app + '.min.js')) 
       .pipe(gulp.dest('client/build')); 
    }); 

    gulp.task('rmRevManifest', function() { 
     return gulp.src('client/js/rev-manifest.json', { read: false }) 
       .pipe(rimraf()); 
    }); 

Answer 3

Un esempio di impostazione delle dipendenze in Gulp 3.0. In questo esempio 3 operazioni dipendono dal compito 'pulito' che dovrebbe essere eseguito prima:

// Include Gulp 
var gulp = require('gulp'); 
var task = {}; 

// Clean up 
gulp.task('clean', function() { .. }); 

// HTML pages 
gulp.task('pages', task.pages = function() { ... }); 
gulp.task('pages:clean', ['clean'], task.pages); 

// CSS style sheets 
gulp.task('styles', task.styles = function() { ... }); 
gulp.task('styles:clean', ['clean'], task.styles); 

// JavaScript files 
gulp.task('scripts', task.scripts = function() { ... }); 
gulp.task('scripts:clean', ['clean'], task.scripts); 

// Bundling and optimization 
gulp.task('build', ['pages:clean', 'styles:clean', 'scripts:clean']); 

Con run-sequence sarebbe uguale a:

// Include Gulp & utilities 
var gulp = require('gulp'); 
var runSequence = require('run-sequence'); 

// Clean up 
gulp.task('clean', function() { .. }); 

// HTML pages 
gulp.task('pages', function() { ... }); 

// CSS style sheets 
gulp.task('styles', function() { ... }); 

// JavaScript files 
gulp.task('scripts', function() { ... }); 

// Bundling and optimization 
gulp.task('build', ['clean'], function (cb) { 
    runSequence(['pages', 'styles', 'scripts'], cb); 
}); 

P.S.: nel prossimo Gulp 4.0 il sistema delle dipendenze sarà molto meglio.