gulpでplumberが動かないときの単純なミス

gulpでSASSをコンパイルする際、SASSで記述ミスがあったりすると”gulp watch”が中断されてしまう。

それを防ぐために”gulp-plumber”を使用しているわけですが、設定しているにも関わらずやっぱりどうにも中断されてしまう。

Node.jsやモジュールのバージョンのせいか、はたまたgulpfileの書き方が悪いのかといろいろ調べていたけど、結局解決しないまま月日は流れ…

そしてある日、急に解決しました。原因はとても単純。

var gulp = require('gulp');
var sass = require('gulp-sass');
var sassGlob = require('gulp-sass-glob');
var autoprefixer = require('gulp-autoprefixer');
var browser = require('browser-sync');
var plumber = require('gulp-plumber');
var sourcemaps = require('gulp-sourcemaps');
var wait = require('gulp-wait');

gulp.task('server', function() {
  browser({
    proxy: 'http://localhost/xxxx/htdocs'
  });
});

gulp.task('sass', function() {
  gulp.src('htdocs/common/_sass/**/*scss')
    .pipe(plumber())
    .pipe(sourcemaps.init())
    .pipe(sassGlob())
    .pipe(wait(100))
    .pipe(sass({
      outputStyle: 'expanded'
    }))
    .pipe(autoprefixer())
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest('htdocs/common/css'))
    .pipe(browser.reload({
      stream: true
    }));
});

gulp.task('default', ['server'], function() {
  gulp.watch('htdocs/common/_sass/**/*.scss', ['sass']);
});

gulp-plumberはタスクの先頭に書いてやる必要があったのでした。