Combining GulpJS Tasks - build

Question

So I have the following GulpJS tasks that are all related with installing and copying bower files:
gulp.task('bower-install', function() {
var command = 'bower install';
gutil.log(gutil.colors.cyan('running command:'), command);
return gulp.src('', {read: false})
.pipe(shell([
command
]));
});
gulp.task('bower-copy', function() {
return gulp.src(gulpConfig.bowerCopy.map(function(item) {
return './bower_components/' + item;
}), {base: './bower_components'})
.pipe(gulp.dest('./htdocs/components'));
});
gulp.task('bower-copy-clean', function() {
return gulp.src('./bower_components')
.pipe(clean());
});
gulp.task('bower-clean', function() {
return gulp.src('./htdocs/components')
.pipe(clean());
});
gulp.task('bower', 'Download and move bower packages', function(done) {
runSequence(
'bower-install',
'bower-clean',
'bower-copy',
'bower-copy-clean',
done
);
});
I am doing it this way because I need these tasks to run sequentially one after the other. While when I run gulp bower everything works as expected, I would like to structure this code so that the only exposed task is bower as all the bower-* are pointless to run by themselves.
Is there any way to write this code so all the bower-* task run one after the other but only expose the bower task?

Answer 1

Because a gulpfile is just a regular node app, usually when we get into stuck situations like this, it's good to ask "what would we do if we didn't have gulp?" Here's my solution:
var async = require('async');
var del = require('del');
var spawn = require('child_process').spawn;
function bowerInstall(cb) {
var command = 'bower install';
gutil.log(gutil.colors.cyan('running command:'), command);
var childProcess = spawn('bower', ['install'], {
cwd: process.cwd(),
stdio: 'inherit'
}).on('close', cb);
});
function bowerCopy(cb) {
gulp.src(gulpConfig.bowerCopy.map(function(item) {
return './bower_components/' + item;
}), {base: './bower_components'})
.pipe(gulp.dest('./htdocs/components'))
.on('end', cb);
});
function bowerCopyClean(cb) {
del('./bower_components', cb);
});
function bowerClean() {
del('./htdocs/components', cb);
});
gulp.task('bower', 'Download and move bower packages', function(done) {
async.series([
bowerInstall,
bowerClean,
bowerCopy,
bowerCopyClean
], done);
});
Note that I also sped up your build substantially by not reading in the entirety of the bower_components and htdocs/components directories into ram.