Bring Your Attention to Sass Errors When Using gulp watch

When you are using browser auto-reload with gulp watch, often you don’t notice if you have an error in your sass. Then you struggle until you remember to look in your gulp console window to see the sass error messages.

My kind of solution is to delete the generated css in case of error like this (using gulp-clean):


clean = require('gulp-clean'),
...
...
.pipe(sass().on('error',
function (error)
{
sass.logError(error);
gulp.src(root + 'style.css', {read: false}).pipe(clean({force: true})); // delete target
}))

This way you get a page without a stylesheet in your browser, so you know you should look in your gulp console for error messages.