looking to watch all the less files in the root gulp project directory and then compile only the saved LESS file. I can't get past the first part.
When I run $ gulp watch in the project directory it hangs. Starts the task and never finishes.
var gulp = require('gulp');
var less = require('gulp-less');
var path = require('path');
gulp.task('compileCurrentTheme', function () {
return gulp.src('./*.less')
.pipe(less({
compress: true
}))
.pipe(gulp.dest('./'));
});
// Gulp watch functions
gulp.task('watch', function(){
gulp.watch('*.less', ['compileCurrentTheme']);
});
You made some mistake
gulp.task('compileCurrentTheme', function () {
return gulp.src('./*.less') // ./ -> root directory
.pipe(less())
.pipe(gulp.dest('yourPath')); // you can also type ./ it will create .css files in your root directory
});
// Gulp watch functions
gulp.task('watch:less', function(){
gulp.watch('./*.less', ['compileCurrentTheme']);
});
Rename your watch
task to watch:less
and then run it from your console gulp watch:less
Please look at gulp-less and gulp especially gulp-watch
just to make your understanding a bit clearly.
I hope it will help you
Thanks