scniro scniro - 3 months ago 30
Node.js Question

How can I spawn multiple gulp watch tasks in respective terminals?

I currently have three gulp tasks, leveraging gulp-watch. They are basic in nature, and are represented (simplified) as such...

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

gulp.task('watch:a', function() {
return watch('a/**/*.js', function () {
// [...]
});
});

gulp.task('watch:b', function() {
return watch('b/**/*.js', function () {
// [...]
});
});

gulp.task('watch:c', function() {
return watch('c/**/*.js', function () {
// [...]
});
});


However, with my current workflow, I'm forced to open three terminals, and fire them off individually.




Is there a way I can instead have one gulp task, which spawns three separate terminal windows with each task running? I have looked into child process but have not been able to craft a solution. Ideally, I'm visualizing something as such...

gulp.task('watch', function() {
launchProcess('gulp watch:a');
launchProcess('gulp watch:b');
launchProcess('gulp watch:c');
});


Where
launchProcess
has some magic so I can consolidate these into one command. I'm simply searching for convenience here, since there could be more than three processes. I cringe at the thought of manually firing tons of these processes off.




Here is my initial attempt, taken from Answer: Gulp – How Can I Open A New Tab In Terminal?, but this (just trying to fire one watcher) does not let my watcher task work as expected - nothing happens on a file change.

var exec = require('child_process').exec;

gulp.task('watch', function(cb) {

exec('gulp watch:a', function (err, stdout, stderr) {
console.log(stdout);
console.log(stderr);
cb(err);
});
});

Answer

Your own solution isn't really what I expected from your question because, as you said yourself, it's not opening new terminal tabs or anything.

If you're happy with that, the below line will have the same effect as your answer. It also avoids gulp.start() which isn't recommended for use by the authors of Gulp.

gulp.task('watch', ['watch:a', 'watch:b', 'watch:c']);

Or if possible you could always combine your watch tasks like below. Although you then lose the ability to run those tasks individually if that's something you want to do.

gulp.task('watch', function() {
    watch('a/**/*.js', function () {
        // [...]
    });

    watch('b/**/*.js', function () {
        // [...]
    });

    watch('c/**/*.js', function () {
        // [...]
    });
});
Comments