Search code examples
gulpgulp-watchgulp-less

Gulp task runs multiple times


I have a gulp task that runs multiple times every time I make a change to a file.

var gulp = require('gulp');
var concat = require('gulp-concat')
var gulpLess = require('gulp-less');
var notify = require("gulp-notify");

var less = []; // array of less files
var css = []; // array of css files

gulp.task('less', function() {
    return gulp.src(less)
        .pipe(gulpLess())
        .pipe(gulp.dest('./assets/css/'));
});

gulp.task('css', ['less'], function() {
    return gulp.src(css)
        .pipe(concat('style.css'))
        .pipe(gulp.dest('./htdocs/assets/'))
        .pipe(notify('CSS finished compiling!'));
});

gulp.task('watch', function() {
    gulp.watch(css.concat(less), ['css']);
    gulp.watch(js, ['js']);
});

When I execute gulp watch and make a change to one of the watched css or less files, the less and css tasks run four times in order. As well, the notification runs each time which gets a bit much when I'm making a lot of revisions.

Any assistance would be appreciated.


Solution

  • gulp.task('css', ['less'], function() {}. Thats two times there. Less dest is css. Thats two more.