Übergeben von Variablen zwischen "Pipes" in Gulp

Question

Ich versuche, einen Schluck Aufgaben schreiben, die einige Benutzereingaben über die gulp-prompt plugin nimmt. Aber ich habe Probleme, dass die Eingabe zusammen mit anderen zB vorbei:

gulp.task('userinput', function(){ 

    var myVar = 'MONKEY'; 

    gulp.src('./templates/_component.*') 
    .pipe(prompt.prompt([ 
     { 
      type: 'input', 
      name: 'userInput', 
      message: 'Say something' 
     } 
    ], function(res){ 
     myVar = res.userInput; 
    })) 
    .pipe(prompt.confirm('You said ' + myVar)); 
}); 

Angenommen, ich hello an der Eingabeaufforderung eingeben, ich war die Bestätigung erwartet You said Hello zu sagen, aber es sagt You said MONKEY.

Ist dies mit Gulp möglich?

Answer 1

Das hier Problem ist, dass Sie die zweite Eingabeaufforderung erstellen ('You said ' + myVar) vor die erste Eingabeaufforderung ausgeführt wurde:

1. Set myVar-'MONKEY'
2. Ströme erstellen
   1. erstellen src Strom, der asynchron ist
   2. Erstellen Sie die erste Eingabeaufforderung, und fügen Sie es der Src-Strea hinzu m
   3. zweite Eingabeaufforderung erstellen aktuellen Wert von myVar verwenden, und fügen Sie sich in dem ersten Eingabeaufforderung Strom
3. Erst jetzt wird die ausgeführt Ströme verarbeitet
   1. Last Quellen
   2. Run erste Aufforderung des myVar
   3. Run die zweite Aufforderung zuvor erzeugte Nachricht mit

Die einzige Lösung, wenn Sie alles als einen einzigen Stream behalten möchten, ist die Variable in etwas zu verwenden, das eine Schließung (Funktion) ermöglicht. Einige Plugins akzeptieren bereits eine Schließung als Argument, die meisten aber nicht.

Eine Lösung, um einen Stream in eine Schließung zu wickeln, die hier funktionieren würde, ist gulp-tap, die nicht speziell für dieses Szenario entwickelt wurde, aber sollte funktionieren. es sieht wie folgt aus:

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

//... 

gulp.task('userinput', function(){ 

    var myVar = 'MONKEY'; 

    gulp.src('./templates/_component.*') 
    .pipe(prompt.prompt([ 
     { 
      type: 'input', 
      name: 'userInput', 
      message: 'Say something' 
     } 
    ], function(res){ 
     myVar = res.userInput; 
    })) 
    .pipe(tap(function(file, t) { 
     // format is t.through(stream-function, [arguments...]) 
     return t.through(prompt.confirm, ['You said ' + myVar]); 
    }); 
}); 

Da dies in einem Verschluss gewickelt ist, und für jede Datei ausgewertet, wird es den aktuellen Wert für die Variable abholen. Da es jedoch für jede Datei funktioniert, sehen Sie die Eingabeaufforderung einmal für jede Datei verarbeitet.

---

Eine bessere Lösung wäre es Ihre Aufgabe in mehrere, abhängige Aufgaben zu trennen. Das wäre in etwa so aussehen:

var myVar = 'MONKEY'; 

gulp.task('userinput1', function(){ 

    return gulp.src('./templates/_component.*', {read: false}) 
     .pipe(prompt.prompt([ 
      { 
       type: 'input', 
       name: 'userInput', 
       message: 'Say something' 
      } 
     ], function(res){ 
      myVar = res.userInput; 
     })); 
}); 

gulp.task('userinput', ['userinput1'], function() { 
    return gulp.src('./templates/_component.*') 
     .pipe(prompt.confirm('You said ' + myVar)); 
}); 

Nun ist die erste Aufgabe (userinput1) laufen soll und vollständig vor die zweiten verarbeitet (userinput2), so wird der Variable richtig eingestellt sein.

HINWEIS: Stellen Sie sicher, return den Strom von Ihren Aufgaben, da sie sich synchron verarbeitet werden, und Ihre Variable wird nicht fertig.

---

Schließlich könnte es mehr Sinn machen, die gulp-prompt Aufgabe ganz zu verzichten, weil es nicht wirklich hat viel mit dem Strom zu tun. Es wäre wahrscheinlich besser, wenn Sie in Ihrer Aufgabe direktes Node-JavaScript verwenden, um die Eingaben des Benutzers zu sammeln (vorzugsweise auf synchrone Weise) und dann Ihre Dateien anschließend in einem Gulp-Stream zu verarbeiten.