I'm having trouble getting gulp-watch or gulp-watch-less to fire after following the documented examples. I originally through the problem was with lazypipe (not shown here), but it appears to me that I'm doing something wrong in the way I'm using the plugins. Here's my dumbed-down code which is still not working.
Note that I tried this with plain gulp-watch and it exhibits the exact same issue: it doesn't trigger subsequent pipes on change. I'll include info around that here in case that's the problem.
Here's my gulpfile.
var debug = require ( 'gulp-debug' );
var gulp = require ( 'gulp' );
var less = require ( 'gulp-less' );
var watchLess = require ( 'gulp-watch-less' );
gulp.task ( 'dev-watch', function () {
// main.less just imports child less files
gulp.src ( './app/styles/less/main.less' )
.pipe ( watchLess ( './app/styles/less/main.less' ) )
.pipe ( debug () );
.pipe ( less () )
.pipe ( gulp.dest ( './app/styles' ) )
;
});
When I start the task, it executes and generates the expected files perfectly. I see debug output the stream info just fine as well.
When I change a file I see that watchLess is picking up the change:
[10:49:54] LESS saw child.less was changed
[10:49:54] LESS saw child.less was changed
[10:49:54] LESS saw main.less was changed:by:import
[10:49:54] LESS saw main.less was changed:by:import
However, the less task doesn't execute. It doesn't appear to be emitting anything because debug doesn't fire.
Here's the pertinent package.json info:
"devDependencies": {
"gulp": "^3.8.7",
"gulp-less": "^1.3.6",
"gulp-watch": "^1.2.0",
"gulp-watch-less": "^0.2.1"
}
Your code merely runs the watcher in pipe, but does not tell what to do then.
The working example should be the following:
var
gulp = require('gulp'),
debug = require ('gulp-debug'),
less = require ( 'gulp-less'),
watchLess = require('gulp-watch-less');
gulp.task('dev-watch', function () {
watchLess('./app/styles/less/main.less')
.pipe (debug ())
.pipe(less())
.pipe(gulp.dest('./app/styles'))
});
However, you can also do the same thing using merely gulp-watch or gulp (gulp.watch).