Tâche Gulp.js, retour sur src?

132

Je suis nouveau à gulp et j'ai regardé à travers des exemples de configurations. 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 ??

boldfacedesignuk
la source

Réponses:

158

Vous devez returnindiquer que la tâche est asynchrone. gulp.src()renvoie un flux, donc c'est asynchrone.

Sans cela, le système de tâches ne saurait pas quand il a terminé. Lisez les documents .

Sindre Sorhus
la source
Excellent! merci pour la réponse Sindre. Avoir gorgée comme un charme maintenant. Aimer.
boldfacedesignuk
Génial exactement ce que je cherchais :)
Sebastien Lorber
14
Cela signifie-t-il que vous devez revenir lors de l'utilisation gulp.src()? Que se passe-t-il si vous ne revenez pas gulp.src()?
jbandi
11
Je seconde @ jbandi's - la question évidente à se poser ici est "y a-t-il une raison de ne pas revenir gulp.src(..., ou devrions-nous le faire toujours?" Cette réponse serait plus utile si elle abordait ce point, l'OMI; à l'heure actuelle, il ne traite pas des raisons pour lesquelles il existe de nombreux exemples de tâches qui appellent gulp.src(...mais ne le renvoient pas.
Mark Amery
2
@jbandi: Si vous ne le faites pas, returnle système de dépendances peut démarrer la tâche a avant que ses dépendances ne soient terminées. J'ai un gulpfile avec beaucoup de tâches (principalement générées par du code). Comme je ne retournais pas le flux, une tâche dépendante lisait déjà le fichier alors que sa dépendance était encore en cours de création. Ça me met dans toutes sortes de problèmes ...
gligoran
37

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

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 attendez à ce que task1 se termine (par exemple, la compilation du coffeescript ou autre) avant que task2 ne s'exécute ... mais à moins que nous ajoutions return - comme dans l'exemple ci-dessous - alors ils s'exécuteront de manière synchrone et non asynchrone; et le coffeescript compilé ne sera pas minifié car task2 n'aura pas attendu la fin de la tâche 1 et ne reprendra donc pas la sortie compilée de task1 . Nous devrions donc 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 ici l'explique plus en détail. https://github.com/gulpjs/gulp/blob/master/docs/recipes/running-tasks-in-series.md

byronyasgur
la source
26

J'ai trouvé cela utile, si vous avez plusieurs flux par tâche. Vous devez combiner / fusionner les multiples 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, en 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']);
jpblancoder
la source