0

I have been trying to solve this problem for a couple of days now. I am trying to get gulp to compile my less files when I save them but gulp-watch-less is not being triggered by changes in files I am watching. My gulpfile.js is:

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

gulp.task('default', function () {
    return gulp.src('less/style.less')
        .pipe(watchLess('less/style.less'))
        .pipe(less())
        .pipe(gulp.dest('css'));
});

/*
gulp.task('watch', function() {
   // Watch less files
  gulp.watch('less/style.less', ['less']);
 });

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

gulp.task('default', ['watch']);
 */

When I run gulp initially it will generate a new css file, but after that any changes I make to style.less are not triggering the new file update. When I do make changes the console does show:

LESS saw style.less was changed

But the new file is not generated. I tried to follow solutions at Gulp suddenly not working anymore after npm update #800. I have re-installed nodejs twice already to try and get this to work without success.

Ben
  • 897
  • 2
  • 16
  • 34
  • I edited my question replacing gulp.watch with gulp-watch-less as it was the latter which was not triggering and not the former. – Ben Mar 18 '15 at 14:30

1 Answers1

3

I managed to solve this by using gulp-watch in place of gulp-watch-less. My new gulpfile.js is:

var gulp = require('gulp');
//var watchLess = require('gulp-watch-less');
var watch = require('gulp-watch');
var less = require('gulp-less');
/*
gulp.task('default', function () {
    return gulp.src('less/style.less')
        .pipe(watchLess('less/style.less'))
        .pipe(less())
        .pipe(gulp.dest('css'));
});
*/

gulp.task('watch', function() {
   // Watch less files
  watch('less/style.less', function() {
    gulp.start('less');
    });
 });

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

gulp.task('default', ['watch']);

There does seem to be a problem with using gulp-watch-less on Windows that is not triggering tasks when files are altered.

Ben
  • 897
  • 2
  • 16
  • 34