issue with piping gulp-watch into gulp-ruby-sass

Question

Maybe I'm an idiot, but I cannot get the combination of gulp-watch and gulp-ruby-sass to work. Any suggestions are hugely welcome. For all the following, the require() calls in my gulpfile.js look like this:

var gulp = require('gulp');
var watch = require('gulp-watch');
var plumber = require('gulp-plumber');
var sass = require('gulp-ruby-sass');

The next bit is what I can't get working. When I change a file I see the output from gulp-watch stating the file was changed, but no output from gulp-ruby-sass and the file isn't written to the dist/ directory.

gulp.task('test-watch', function() {
    return watch('./**/*.scss')
        .pipe(plumber())
        .pipe(sass())
        .pipe(gulp.dest('dist/'));
});

Yet I know both gulp-watch and gulp-ruby-sass are setup correctly individually because they work fine on their own:

// writes updated files to dist/ successfully
gulp.task('test-watch', function() {
    return watch('./**/*.scss')
        .pipe(plumber())
        .pipe(gulp.dest('dist/'));
});

// compiles into css and writes to dist/ directory successfully
gulp.src('./**/*.scss')
    .pipe(sass())
    .pipe(gulp.dest('dist/'));

So what's my problem? Even more vexing, the example above that does not work actually comes from the gulp-watch readme, so should be something that's supported. Any advice is very welcome!

Cameron Cameron · Accepted Answer · 2015-01-14T18:00:30

It seems the "solution" is to use gulp-sass for this instead of gulp-ruby-sass.

I still do not know why gulp-ruby-sass doesn't support this since piping the results of gulp.src() into and out of gulp-ruby-sass works like a champ, but it doesn't. I wonder if gulp-watch returns a different file format than gulp.src that gulp-ruby-sass can't handle but gulp-sass can.

If anyone knows how to make this work for gulp-ruby-sass since that's supposedly more fully-featured, please do share.

issue with piping gulp-watch into gulp-ruby-sass

1 Answers