How To Mark Gulp Task As Completed When More Than One Gulp Streams Are Being Executed?

I need my gulp tasks to be synchronous (process JS and CSS async, but only after those are completed process HTML since it contains inline JS and CSS), and while plugins like gulp-

Solution 1:

You can use merge-stream or event-stream packages. Here is example for merge-stream:

var merge = require('merge-stream');
gulp.task('process-css-debug', function() {
     var first = gulp
        .src('src/**/app.scss')
        .pipe(gp.plumber())
        .pipe(gp.sass().on('error', gp.sass.logError))
        .pipe(gp.autoprefixer())
        .pipe(gp.rename('app.min.scss'))
        .pipe(gulp.dest('./app'));

     var second = gulp
        .src('src/**/app.inline.scss')
        .pipe(gp.plumber())
        .pipe(gp.sass().on('error', gp.sass.logError))
        .pipe(gp.autoprefixer())
        .pipe(gp.rename('app.inline.min.scss'))
        .pipe(gulp.dest('./app'));

     return merge(first, second);
});