web-dev-qa-db-fra.com

Gulp.js, retour sur src?

Je suis nouveau à avaler et ai regardé à travers des exemples de montages. Certaines personnes ont la structure suivante:

gulp.task("XXXX", function() {
    gulp.src("....

D'autres personnes ont ceci:

gulp.task("XXXX", function() {
   return gulp.src("....

Je me demande quelle différence le retour sur le Src fait ??

javascriptnode.jsgulp
129
boldfacedesignuk

Vous return pour indiquer que la tâche est asynchrone. gulp.src() renvoie un flux, il est donc asynchrone.

Sans cela, le système de tâches ne saurait pas quand il aura fini. Lisez le docs .

156
Sindre Sorhus

Si vous avez des tâches dépendantes, vous devez renvoyer le flux afin que les tâches attendent la fin de leurs tâches dépendantes avant de s'exécuter elles-mêmes.

par exemple 

// without return
gulp.task('task1', function() {
    gulp.src('src/coffee/*.coffee')
      /* eg compile coffeescript here */
     .pipe(gulp.dest('src'));
});

gulp.task('task2', ['task1'], function() {
    gulp.src('src/*.js')
      /* eg minfify js here */
     .pipe(gulp.dest('dest'));
});

dans cet exemple, vous vous attendriez à ce que task1 se termine (par exemple, compiler le coffeescript ou quoi que ce soit d'autre) avant task2 s'exécute ... mais à moins d'ajouter return - comme dans l'exemple ci-dessous - ils s'exécuteront de manière synchrone et non asynchrone; et le coffeescript compilé ne sera pas réduit au minimum car task2 n'aura pas attendu la fin de la tâche 1 et ne reprendra donc pas le résultat compilé de task1 . Donc, nous devrions toujours revenir dans ces circonstances.

// with return
gulp.task('task1', function() {
    return gulp.src('**/*.coffee')
      /* your operations here */
     .pipe(gulp.dest('dest'));
});

gulp.task('task2', ['task1'], function() {
    return gulp.src('**/*.js')
      /* your operations here */
     .pipe(gulp.dest('dest'));
});

Edit: La recette ci-dessous l'explique davantage. https://github.com/gulpjs/gulp/blob/master/docs/recipes/running-tasks-in-series.md

36
byronyasgur

J'ai trouvé cela utile si vous avez plusieurs flux par tâche. Vous devez combiner/fusionner plusieurs flux et les renvoyer.

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

gulp.task('test', function() {
    var bootstrap = gulp.src('bootstrap/js/*.js')
        .pipe(gulp.dest('public/bootstrap'));

    var jquery = gulp.src('jquery.cookie/jquery.cookie.js')
        .pipe(gulp.dest('public/jquery'));

    return merge(bootstrap, jquery);
});

L’alternative, utilisant la structure de définition de tâche Gulps, serait:

var gulp = require('gulp');

gulp.task('bootstrap', function() {
    return gulp.src('bootstrap/js/*.js')
        .pipe(gulp.dest('public/bootstrap'));
});

gulp.task('jquery', function() {
    return gulp.src('jquery.cookie/jquery.cookie.js')
        .pipe(gulp.dest('public/jquery'));
});

gulp.task('test', ['bootstrap', 'jquery']);
26
jpblancoder