2017-11-03 2 views
0

Ich versuche, alle CSS-Dateien in eine frei CSS-Datei verketten durch Aufgabe ausgeführt wird:Wie man Schluckaufgaben in Reihenfolge ausführt?

gulp.task('task one',() => { 
    gulp.src([Dir + "**/*.css"]) 
     .pipe(concat(outFilename + ".css")) 
     .pipe(gulp.dest(destDir)); 
}); 

Danach, weil der Font-Pfad in der Ausgabe CSS-Datei nicht korrekt ist, also muss ich den Pfad ändern .

gulp.task('task two',() => { 
    var urlAdjuster = require('gulp-css-url-adjuster'); 

    //change font path for released css files 
    gulp.src([releasePath + "/*.css"]) 
     .pipe(urlAdjuster({ 
      replace: ['../../fonts', '../fonts'], 
     })) 
     .pipe(gulp.dest(releasePath + "/")); 
); 

Um dies zu erreichen, muss ich diese beiden Aufgaben einzeln nacheinander ausführen. Wie kann ich diese zwei Aufgaben in einer Reihenfolge ausführen und sie in einer Aufgabe ablegen.

ich versucht habe: series = require('gulp-series'); ---- nicht

gulp.task('task two', ['task one'], function() { 
    // Gulp. src (... 
}); 

Arbeits ----- nicht funktioniert

--- Update ------------ -------------------------------------------- Ich benutzte Rückkehr aber es arbeitet jetzt. Die tatsächlichen Codes sind:

function procHTMLForRelease(stream, file) { 
    gulp.src([Dir + "**/*.css"]) 
     .pipe(concat(outFilename + ".css")) 
     .pipe(gulp.dest(destDir)); 

} 

function processRelease() { 


    // Grab all html files in the folder. 
    // Loop over them, process them, then spit em out. 
    gulp.src([paths.Source + "/*.html"]) 
     .pipe(foreach(procHTMLForRelease)) 
     .pipe(gulp.dest(paths.Release)); 

    // Process image files 
    gulp.src([paths.Source + "images/*.*"]) 
     .pipe(gulp.dest(paths.Release + "images/")); 

    // Copy font files 
    gulp.src([paths.html + "fonts/*.*", paths.html + "fonts/*/*.*"]) 
     .pipe(gulp.dest(paths.release + "/fonts/")); 


} 



gulp.task('task one',() => { return processRelease(); 
}); 
+0

Ihre ursprünglichen Codes sind völlig verschieden von den aktualisierten, Wie kommt es? – lofihelsinki

Antwort

0
gulp.task('task two', ['task one'], function() { 
    // gulp.src(... 
}); 

dies richtig ist, setzt sie task one als Abhängung für task two. Damit dies jedoch funktioniert, muss task onereturn sein.

gulp.task('task one',() => { 
    return gulp.src([Dir + "**/*.css"]) 
     .pipe(concat(outFilename + ".css")) 
     .pipe(gulp.dest(destDir)); 
}); 
+0

@ lofihelsinki Ich habe "Rückkehr" verwendet, aber es funktioniert nicht wirklich, siehe meine Updates –

+0

Sie müssen jedes 'gulp.src' in seine eigene Aufgabe setzen und die' gulp.src' zurückgeben, wie in meiner Antwort. Ihr ursprüngliches Beispiel sollte funktionieren, wenn Sie 'return' vor' gulp.src' hinzufügen. Ihr Update-Beispiel hat nichts als Abhängigkeit, also würde es nicht funktionieren. – lofihelsinki

0

Sie können Ihren aktualisierten Code so ändern, dass er return ist.

gulp.task('taks one', function() { 

    // Grab all html files in the folder. 
    // Loop over them, process them, then spit em out. 
    var one = gulp.src([paths.Source + "/*.html"]) 
     .pipe(foreach(procHTMLForRelease)) 
     .pipe(gulp.dest(paths.Release)); 

    // Process image files 
    var two = gulp.src([paths.Source + "images/*.*"]) 
     .pipe(gulp.dest(paths.Release + "images/")); 

    // Copy font files 
    var three = gulp.src([paths.html + "fonts/*.*", paths.html + "fonts/*/*.*"]) 
     .pipe(gulp.dest(paths.release + "/fonts/")); 

    // Return 
    return [ one, two, three]; 

}); 

Die Aufgaben innerhalb der Funktion wird asynchron ausgeführt, aber Sie können eine andere Funktion diejenigen abhängig machen auf alle getan.

gulp.task('task two', ['task one'], function() { 
    // Gulp. src (... 
}); 
-1

Für alle, hat das gleiche Problem und suchen nach einer Lösung: Hier ist, was ich tun, um es zu beheben: https://www.npmjs.com/package/run-sequence

Zum Beispiel:

// This will run in this order: 
// * build-clean 
// * build-scripts and build-styles in parallel 
// * build-html 
// * Finally call the callback function 
gulp.task('build', function(callback) { 
    runSequence('build-clean', 
       ['build-scripts', 'build-styles'], 
       'build-html', 
       callback); 
}); 
Verwandte Themen