gulp-less not creating output css

Question

I've been struggling with this for a few hours now. I have the following in my gulpfile:

gulp.task('styles', function() {
  gulp.src('C:\\TeamCity\\buildAgent\\work\\5003e8de5901599\\dev\\Content\\css\\less\\dealer-landing.less')
    .pipe(less())
    .pipe(gulp.dest('C:\\TeamCity\\buildAgent\\work\\5003e8de5901599\\dev\\Content\\css'));
});

I run 'gulp styles' which completes with no errors, but the .css is never created. I tried simply commenting out the middle line as seen below and that works as expected; the less file gets copied to the dest directory:

gulp.task('styles', function() {
  gulp.src('C:\\TeamCity\\buildAgent\\work\\5003e8de5901599\\dev\\Content\\css\\less\\dealer-landing.less')
    //.pipe(less())
    .pipe(gulp.dest('C:\\TeamCity\\buildAgent\\work\\5003e8de5901599\\dev\\Content\\css'));
});

Any idea why gulp-less doesn't generate the css? If I use just less, the file is generated correctly.

Answer 1

I experienced this due to an undefined class in my less file.

I discovered the undefined class through logging.

Gulp may not throw errors unless you explicitly log them. To log, require gulp-util in your gulpfile:

var util = require('gulp-util');

And then add logging:

.pipe(less().on('error', util.log)),

Run gulp style to see the error (possibly an undefined class).

Fix it and your style task should generate the css.