如何使用多个管道与吞咽if和lazypipe



我有一个Grunt文件,它在不使用gulpif和lazypipes的情况下工作,但我要做的是创建一个任务,该任务将使用useref接收index.html页面中的脚本文件。然后是gulpif JS lintuglify/concatenate和notify。我收到一个"错误:对lazypipe()的无效调用…",我正在看这篇文章https://github.com/OverZealous/lazypipe/issues/19,但我有点绿,不理解错误/如何修复"pipe(foo)vs.pipe(foo()"如果有人能告诉我我怎么用错了拉兹皮管=我应该很好

grunt文件更大,我正在使用gulpif bc-css,一旦它起作用,也会使用。如果有更好的方法让我知道,谢谢。

使用中的插件:

var gulp        = require('gulp'),
jshint          = require('gulp-jshint'),
notify          = require('gulp-notify'),
gulpif          = require('gulp-if'),
lazypipe        = require('lazypipe'),
useref          = require('gulp-useref');
uglify          = require('gulp-uglify');
var anyJS       = '/**/*.js',
    distFolder  = 'dist';
//Lazy Tasks
    var jsTask = lazypipe()
        .pipe(jshint)
        .pipe(jshint.reporter('jshint-stylish'))
        .pipe(notify('JS Linting finished'))
        .pipe(uglify())
        .pipe(notify('JS Compressing finished'));

//Tasks
    gulp.task('mini', function () {
        return gulp.src('./index.html')
            .pipe(useref())
            .pipe(gulpif(anyJS, jsTask()))
            .pipe(gulp.dest(distFolder));
    });

所以我终于发现了问题所在。LazyPipe中的所有函数调用都不能使用()!因此,如果你有lazypipe().pipe(jshint).pipe(uglify()),它将不起作用-你也需要删除uglify上的()。

我想我会用LP和GF再试一次,但这里是用gullFilter或至少90%。通知没有显示。

gulp.task('mini', function () {
    var jsFilter = gulpFilter(jsInput, {restore: true});
    var cssFilter = gulpFilter(cssInput, {restore: true});
    return gulp.src('./index.html')
        .pipe(plumber({
            handleError: function (err) {
                console.log(err);
                this.emit('end');
            }
        }))
        .pipe(useref())
        .pipe(jsFilter)
        .pipe(jshint())
        .pipe(jshint.reporter('jshint-stylish'))
        .pipe(uglify())
        .pipe(notify('JS task finished'))
        .pipe(jsFilter.restore)
        .pipe(cssFilter)
        .pipe(sass())
        .pipe(autoPrefixer('last 2 versions'))
        .pipe(cssComb())
        .pipe(mmq({
            log: true
        }))
        .pipe(minifyCss())
        .pipe(notify('CSS task finished'))
        .pipe(cssFilter.restore)
        .pipe(gulp.dest(distFolder));
});

正如您在自己的回答中指出的,当您使用lazypipe进行管道传输时,需要使用流工厂本身(而不是结果)。对于不使用参数的工厂,这就像删除()一样简单,对于需要参数的工厂来说,可以使用箭头函数来创建这样的工厂:

var jsTask = lazypipe()
    .pipe(jshint)
    .pipe(() => jshint.reporter('jshint-stylish'))
    .pipe(() => notify('JS Linting finished'))
    .pipe(uglify)
    .pipe(() => notify('JS Compressing finished'));

使用bind()也可以创建这样的工厂,但上面的方法更容易,因为您不需要担心调用上下文。

相关内容

  • 没有找到相关文章

最新更新