Chain sequential tasks

Question

I have 3 tasks that I want to process and when those 3 tasks are done I want to do the following:

1. Concat the three files together
2. Uglify
3. Write to disk

With Grunt I had a long process for all this. Here is what I have tried with Gulp

gulp.task('libs', function () {
return gulp.src('js/libs/*.js')
        .pipe(concat('01.libs.js', {newLine: ';'}))
        .pipe(gulp.dest('min'));
});

gulp.task('plugins', function () {
    return gulp.src('js/plugins/*.js')
            .pipe(concat('02.plugins.js', {newLine: ';'}))
            .pipe(gulp.dest('min'));
});

gulp.task('apps', function () {
    return gulp.src('js/apps/**/*.js')
            .pipe(concat('03.apps.js', {newLine: ';'}))
            .pipe(gulp.dest('min'));
});

gulp.task('scripts', ['libs', 'plugins', 'apps'], function () {
    return gulp .src('min/*.js')
            .pipe(concat('testFile.js', {newLine: ';\r\n'}))
            .pipe(rename({suffix: '.min.v' + pkg.version }))
            .pipe(gulp.dest('min'))
            .pipe(notify({ message: 'Scripts minified'}));
});

This works but I want to just stream the output rather than write out 3 intermediate files only to then concat those.

So I then tried:

function libs () {
    return gulp.src('js/libs/*.js')
            .pipe(concat('01.libs.js', {newLine: ';'}));
}

function plugins () {
    return gulp.src('js/plugins/*.js')
            .pipe(concat('02.plugins.js', {newLine: ';'}));
}

function apps () {
    return gulp.src('js/apps/**/*.js')
            .pipe(concat('03.apps.js', {newLine: ';'}));
}

So then my build would be:

gulp.task('build', function () {
    return libs()
        .pipe(plugins())
        .pipe(apps())
        .pipe(concat('TestFile.js', {newLine: ';\r\n'}))
        .pipe(rename({suffix: '.min.v' + pkg.version }))
        .pipe(gulp.dest('min'));
});

This doesnt work.

So I tried Q:

function allOfThem () {
    return Q.all(libs(), plugins(), apps());
}

gulp.task('build', function () {
    return allOfThem().then(function (one, two, three) {
        console.log(one, two, three);
    });
});

This I guess works but no data in the callback for then.

I'm lost. What's the best way to achieve this?

Answer 1

Use event-stream.merge

var es = require('event-stream');
gulp.task('build', function () {
    return es.merge(libs(), plugins(), apps())
        .pipe(concat('TestFile.js', {newLine: ';\r\n'}))
        .pipe(rename({suffix: '.min.v' + pkg.version }))
        .pipe(gulp.dest('min'));
});