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'])
});

Does it run through all the files each time you make a change to a less file or only the first time,when 'watch' task is first run? I believe it is expected behavior that the first time all the files will pass through gulp-changed. — Mark, Aug 09 '17 at 20:16
@Mark any changes start compile all files, for example i add '; or &nbsp, any changes' and than run full task styles:build — Dmytro Lishtvan, Aug 09 '17 at 20:19
You need another close paren ) at the end of the changed pipe. — Mark, Aug 09 '17 at 20:36
.pipe(changed(pathes.build.styles), {extension: '.css'})) <-- note I have added another close parenthesis at the end. Try that change and see if it helps although I would think you be getting errors without it. — Mark, Aug 09 '17 at 20:39
@mark - i mean -all okay with bracket) There are no superfluous brackets, everything is open and closed — Dmytro Lishtvan, Aug 09 '17 at 20:48
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/151540/discussion-between-mark-and-dmitriy-lishtvan). — Mark, Aug 09 '17 at 20:49

Mark · Answer 1 · 2017-08-09T21:25:27.000

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.

edited Aug 09 '17 at 21:25

answered Aug 09 '17 at 20:49

Mark

143,421
24
428
436

.pipe(changed(pathes.build.styles, {extension: '.css'})) - that write, but it still work badly – Dmytro Lishtvan Aug 09 '17 at 21:12
Then I would try gulp-cached, see this answer https://stackoverflow.com/questions/37113942/gulp-changed-with-gulp-concat-not-working – Mark Aug 09 '17 at 21:51
Ok i'll try later, i need go too sleep – Dmytro Lishtvan Aug 09 '17 at 21:57
cached -help me, now compile only changed file, but i have new problem)) cache don't see import less files, when i change file - he compile, but main file was the same – Dmytro Lishtvan Aug 10 '17 at 06:45

score 0 · Answer 2 · answered Aug 10 '17 at 08:45

0

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

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

answered Aug 10 '17 at 08:45

Dmytro Lishtvan

788
7
12

gulp less compile only changed file

2 Answers2