gulp less compile only changed file

Question

i have problem, when i run gulp watch -> run task styles:build, and all of my less files was recompile. How i can compile only changed file?

gulp.task('styles:build', function () {
    return gulp.src(pathes.src.styles)
        .pipe(changed(pathes.build.styles), {extension: '.css'})
        .pipe(print(function(filepath) {
            return "➔ file was changed: " + filepath;
        }))
        .pipe(plumber())
        .pipe(less({
            plugins: [autoprefix, cleanCSSPlugin],
            paths: ['./', 'web/styles']
        }))
        .pipe(gulp.dest(pathes.build.styles))
});


gulp.task('watch', function() {
   gulp.watch(pathes.src.styles, ['styles:build'])
});

Answer 1

You need to modify the line below to add a closing parenthsis:

.pipe(changed(pathes.build.styles, {extension: '.css'}))

Also as I cautioned the first time the task is run it probably will pass through all files.

Answer 2

i think i found solution just install lessChanged = require('gulp-less-changed') and include him before less pipe

.pipe(lessChanged())
.pipe(less())