0

I have the following task

gulp.task('sass-build', ['clean-build'], function () {
    // do stuff
});

which obviously requires clean-build to be finished before starting. However, I would also like to use this task with gulp.watch without the clean-build dependency.

I'm aware that you could solve this with a helper task like suggested in Skipping Tasks Listed as Dependencies in Gulp, but this would require using gulp.run (which is deprecated) or gulp.start (which isn't even documented because it's considered bad practise).

What would be a better way of doing this? Or is the only way to use gulp.run or gulp.start?

Community
  • 1
  • 1
maxjvh
  • 214
  • 1
  • 6
  • 18

2 Answers2

1

The approach showed in the linked question is actually not that bad. Instead of gulp.run you can use simple functions which do the same:

var sassFunction = function() {
    return gulp.src('blahbla')
        .pipe(bla())
}

gulp.task('sass-build', ['clean-build'], function () {
    return sassFunction()
});

gulp.task('sass-dev', function () {
    return sassFunction();
});


gulp.task('watch', function() {
    gulp.watch('your/sass/files/**/*.scss', ['sass-dev'])
});

Your other approach is also not so bad and will be fully incorporated with Gulp 4.

gulp.task('default', gulp.series('clean-build', gulp.parallel('sass-build')));

Something to look out for, since it changes dependency trees completely.

ddprrt
  • 7,424
  • 3
  • 29
  • 25
0

I solved this using run-sequence. This also made the entire multitask order much clearer.

What I did exactly was remove the clean-build dependency from sass-build. So eventually:

gulp.task('sass-build', function () {
    // do stuff
});

gulp.task('build', function () {
    runSequence('clean-build', [..., 'sass-build', ...], 'index-build');
});

gulp.task('watch', function () {
    gulp.watch('src/sass/*', ['sass-build']);
});

Very convenient!

maxjvh
  • 214
  • 1
  • 6
  • 18