管道工、通知和自定义错误功能在插件 'plumber' 中给我一个错误:消息:无法通过管道传输到未定义

Plumber, notify and a custom error fucntion give me an Error in plugin 'plumber': Message: Can't pipe to undefined

我正在节点中构建一个 Wordpress 主题入门应用程序,gulp 以及用于创建模板的把手。

我在使用 plumber、notify 和 gulp-sass 插件时遇到问题。

这是我的回购 link: https://github.com/elassol/wp-theme

每次我尝试用 gulp 任务编译 sass 时,我都会收到错误消息:

Error in plugin 'plumber' Message: Can't pipe to undefined

我有一个 Pumbler 错误函数,一个 SASS 任务来预处理 sass 和一个 gulp 监视任务来在文件更改时触发 sass 任务。

   

var gulp         = require('gulp');
var gutil        = require('gulp-util');
var autoprefixer = require('gulp-autoprefixer');
var sass         = require ('gulp-sass');
var plumber      = require('gulp-plumber');
var notify       = require('gulp-notify'); 
var browserSync  = require('browser-sync'); 
var cache        = require('gulp-cache');
var imageOpt     = require('gulp-image-optimization');
var jshint       = require('gulp-jshint');
var useref       = require('gulp-useref'); 
var uglify       = require('gulp-uglify'); 
var gulpIf       = require('gulp-if');
var clean        = require('gulp-clean');
var cssnano      = require('gulp-cssnano');
var concat       = require('gulp-concat');
var del          = require('del');
var runSequence  = require('run-sequence');
var sourcemaps   = require('gulp-sourcemaps');
var fs           = require('fs'); 

// ==========================================================
// Pumbler error function
// ==========================================================


function customPlumber(errTitle) { 
  return plumber({
    errorHandler: notify.onError({
          // Customizing error title
          title: errTitle || "Error running Gulp",
          message: "Error: <%= error.message %>",
          sound: "Glass"
        })
    });
}


// ==========================================================
// STYLES TASK
// ==========================================================

gulp.task('sass', function(){
    return  gulp.src(paths.styles.src + '**/*.scss')
       
        .pipe(customPlumber('Error Running Sass'))

        // inititalizr sourcemap before anyother pluging that alter  files
        .pipe(sourcemaps.init())
        .pipe(sass({
            includePaths: ['theme/bower_components'],
            precision: 2
        }))
        .pipe(autoprefixer({
          browsers: ['ie 8-9', 'last 2 versions']
        }))
        .pipe(sourcemaps.write('./'))
        .pipe(gulp.dest(paths.styles.build))
        .pipe(browserSync.reload())
        
})

// ==========================================================
//  WATCH TASK
// ==========================================================
 
gulp.task('watch', ['browserSync'], function(){ 
    gulp.watch(basePaths.src + 'sass/**/*.scss', ['sass']);
    gulp.watch(paths.scripts.src + '**/*.js', browserSync.reload);
    gulp.watch('theme/*.html', browserSync.reload);
    gulp.watch('theme/js/**/*.js', ['jshint']);
})

知道我做错了什么,或者至少指出了正确的方向吗?

在此先感谢大家!

自定义错误函数 不会抛出错误。管道中有一些 undefined pipe源映射行似乎未定义管道。你应该需要 gulp-sourcemaps.


编辑后:在这种情况下你应该改变

  .pipe(sync.reload());

这样一行

  .pipe(sync.reload({stream:true}));

补充说明

在 gulp 任务中应该有一个流通过管道。每个管道都应该 return 流对象,以便将流传递到下一个管道。

在你的代码的第一个版本;同步,由于重新加载方法 return 什么都没有,所以中断了流循环。 gulp 因此抛出一个错误。 stream:true 属性 尝试注入流并 return 返回传入的流。就是这个。

实际上你可以使用 sync.stream() 而不是 sync.reload()。或者如果你不想注入你的样式,你可以像这个例子一样应用

https://www.browsersync.io/docs/gulp/#gulp-reload