减少错误答案

【问题标题】：Gulp Less Errors减少错误
【发布时间】：2016-05-17 11:30:27
【问题描述】：

由于某种原因，我的 gulp 文件已停止输出错误 - 无论我向我的 less 文件添加什么内容，它都会构建并显示我的“工作较少”消息 - 我要拔头发了！请问有什么想法吗？

var gulp = require('gulp');
var cleanCSS = require('gulp-clean-css');
var less = require('gulp-less');
var autoprefixer = require('gulp-autoprefixer');
var notify = require('gulp-notify');
var gutil = require('gulp-util');
var sourcemaps = require('gulp-sourcemaps');
var liveReload  = require('gulp-livereload');
var path = require('path');
var moment = require('moment')

gulp.task('less', function () {
  return gulp.src('./_dev/less/styles.less')
    .pipe(less({
      paths: [ path.join(__dirname, 'less', 'includes') ]
    }))
.pipe(less().on('error', function(err){
    gutil.log(err);
    this.emit('end');
}))
.pipe(liveReload())
.pipe(gulp.dest('./_dev/css'))
.pipe(notify('Less worked at (' + moment().format('MMM Do h:mm:ss A') + ')'));
});

【问题讨论】：

那么......实际的错误呢？

标签： javascript gulp less

【解决方案1】：

您的错误处理程序不是pipe() 调用主链的一部分，因此执行总是继续到gulp-notify 的最后一个管道。 Gulp 中的错误处理可能很棘手，如下面的概述所示：

Error management in gulp

要正确处理这个问题，您应该使用gulp-plumber 来处理错误，例如：

Gulpfile.js

'use strict'

const gulp = require('gulp')
const $ = require('gulp-load-plugins')()
const del = require('del')

// ------------------------------------------------------------

gulp.task('clean', done => {
  del([ './out/**' ]).then(paths => {
    done()
  })
})

// ------------------------------------------------------------

gulp.task('less', [ 'clean' ], function () {
  return gulp.src('./*.less')
    .pipe($.plumber({
      errorHandler (err) {
        $.notify.onError('Error: <%= error.message %>')(err)
        this.emit('end')
      }
    }))
    .pipe($.less())
    .pipe(gulp.dest('./out'))
    .pipe($.notify('Finished: <%= file.relative %>'))
})

// ------------------------------------------------------------

gulp.task('default', [ 'less' ])

ok.less

@col: #05f;
div {
  font-size: 12pt;
  a {
    color: @col;
  }
}

bad.less

@col: #05f;
div {
  font-size: 12pt;
  a {
    color: @link-col;
  }
}

给定两个输入文件ok.less 和bad.less，less 任务将显示bad.less 的错误和ok.less 的完成消息，最终结果是单个输出文件out/ok.css .

通过在errorHandler 函数中注释掉this.emit('end') 行，less 任务将改为显示bad.less 的错误消息，然后停止所有进一步的处理 - 您最终将没有输出文件全部。

这对你有帮助吗？它应该适用于管道中的任何错误的一般情况，允许您停止管道中的所有其他项目（如果您愿意）。

【讨论】：