带有通知的 Gulp-sass 错误答案

【问题标题】：Gulp-sass error with notify带有通知的 Gulp-sass 错误
【发布时间】：2014-05-12 07:59:00
【问题描述】：

我想知道是否有办法让通知显示有关 gulp-sass 错误的消息。最好是显示在控制台中的实际消息。

我的 gulp 任务如下所示：

gulp.task('styles', function() {
  return gulp.src('src/scss/style.scss')
    .pipe(sass({ style: 'compressed', errLogToConsole: true }))
    .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
    .pipe(gulp.dest(''))
    .pipe(livereload(server))
    .pipe(notify({ message: 'Styles task complete' }));
});

我想通过管道将通知传递给某种错误回调。

任何帮助表示赞赏。

【问题讨论】：

标签： sass notify gulp

【解决方案1】：

经过自己的努力，我发现这很有效：

gulp.task('styles', function() {
  return gulp.src('src/scss/style.scss')
    .pipe(sass({
        style: 'compressed',
        errLogToConsole: false,
        onError: function(err) {
            return notify().write(err);
        }
    }))
    .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
    .pipe(gulp.dest(''))
    .pipe(livereload(server))
    .pipe(notify({ message: 'Styles task complete' }));
});

您需要使用 gulp-sass 提供的 onError 选项来捕获错误。

希望有帮助！

【讨论】：

值得补充：.pipe(sass(...).on('error', function() {...}) 不等价。它会捕获错误，但 Sass 在第一个错误后不会运行。
好点，这是我最初尝试的，但在这里忘记提及了。
我认为您可以使用{ onError: notify.onError('<%= error.message %>') } 并让 sass 在第一个错误后继续运行。
如需进一步阅读，请参阅gulp-sass docs here
我在gulp-sass 文档或node-sass 文档中没有看到任何关于onError 处理程序的信息。这是哪里来的？

【解决方案2】：

使用 gulp-sass v2.0.4，这可行：

.pipe(sass())
.on('error', notify.onError(function (error) {
   return 'An error occurred while compiling sass.\nLook in the console for details.\n' + error;
}))

【讨论】：

【解决方案3】：

这也是可行的：

/* Compile sass, and output error to notif */
    .pipe(sass({}).on('error', function(err) {
        return notify().write(err);
    }))

【讨论】：

【解决方案4】：

我在这里聚会有点晚了，但我遇到的问题是，如果代码中有错误，sass 将停止编译，我将不得不重新启动 gulp。这是我最终做的：

gulp.task('sass', function() {
    return gulp.src('assets/scss/style.scss')
        .pipe(sass({ errLogToConsole: false, }))
        .on('error', function(err) {
            notify().write(err);
            this.emit('end');
        })
        .pipe(gulp.dest('assets/css'))
        .pipe(notify({ message: 'SCSS Compiled' }));
});

就我而言，我必须添加this.emit('end');

【讨论】：

当接受的答案不适用于最新版本时，此解决方案适用于 gulp-sass 2.0.4。
...至于停止，您可以使用gulp-plumber'right after gulp.src()`中的.pipe(plumber())。[我正在努力解决的是，我只看到第一个错误，并且仅当该文件刚刚更改时...]

【解决方案5】：

我认为我们也应该在控制台中打印，并且此代码适用于当前版本的 gulp-sass(4.0.1)

gulp.task('sass', function() {
    gulp.src('src/sass/style.scss')
    .pipe(sass({outputStyle: 'expanded'}).on('error',function(err) {
            sass.logError;  //I think we should also print in the console
            return notify().write(err); //and the notification bar
        }))
    .pipe(autoprefixer({browsers:autoprefixBrowsers}))
    .pipe(gulp.dest('dist/css'))
    .pipe(notify({message: 'sass compiled successfully'}));
});

【讨论】：