gulp-filter过滤掉所有的文件 [英] gulp-filter filters out all files

问题描述

我正在将我的工作流程转移到Gulp上，而且我非常喜欢它。然而，我似乎误解了一些关于gulp-filter插件的工作方式......

我有以下任务：

  gulp.task（'assets'，function（）{
 var stylesFilter = gulpFilter（stylesPath）; 
 var imagesFilter = gulpFilter（imagesPath）; 
 var scriptsFilter = gulpFilter（scriptsPath）; 
 
 return gulp.src（[]。concat（'app / ** / *。html'，stylesPath，imagesPath，scriptsPath））
 // STYLES 
 .pipe（stylesFilter）
 .pipe（gulp.dest（'dist / test_styles'））//用于调试！
 .pipe（sass（{style：' （''））
 .pipe（autoPrefixer（'> 1％'，'last 3 versions'，'Firefox ESR'，'Opera 12.1'））
 .pipe（concat（'main。 css'））
 .pipe（minifyCss（））
 .pipe（rev（））
 .pipe（revReplace（））
 .pipe（gulp.dest（'dist / css'））
 .pipe（stylesFilter.restore（））
 
 //脚本
 .pipe（scriptsFilter）
 .pipe（gulp.dest（'dist / test_scripts'））//用于调试！ 
 .pipe（jsHint（'。jshintrc'））
 .pipe（jsHint.reporter（'jshint-stylish'））
 .pipe（concat（'app.js'））$ （b）（b）（b）（b）（b）（b）（b）（b） 
 .pipe（scriptsFilter.restore（））
 
 //图像
 .pipe（imagesFilter）
 .pipe（gulp.dest（'dist / test_images'） ）//用于调试！ 
 .pipe（cache（imageMin（{optimizationLevel：7，progressive：true，interlaced：true}）））
 .pipe（rev（））
 .pipe（revReplace（））
 .pipe（gulp.dest（'dist / img'））
 .pipe（imagesFilter.restore（））; 
}）; 
  

我使用的路径变量定义如下：




bower_components / foundation / scss / ，
'app / styles / app.scss'
]，
scriptsPath = [
'app / scripts / ** / *。js'，
'！ app / scripts / ** / * _ test.js'
]，
imagesPath = [
'app / images / ** / *'
];

我的问题是 stylesFilter ， imagesFilter 和 scriptsFilter 正在过滤掉所有的东西！我已经尝试在上面的任务中添加标记为for debugging的行，以便查看每个过滤部分中正在处理的文件，这表明所有文件都被过滤掉了。没有文件被写入磁盘与上面的调试标记为gulp.dest（）语句）。如果我在 .pipe（* Filter.restore（））行之后添加一行输出文件，它将输出原始输入中的所有文件正确的文件）。我也是，为了好的措施，尝试使用否定模式的过滤器，但是具有完全相同的结果。

那么我错过了什么？为什么过滤器没有返回 ？

解决方案

好的，我找到了原因这种行为：

$ p $ g $ g $ g $ p $ g $ g $ g $ g $ g $ g $ g $ g $ g $ g $ g $ g $ g $ g $ g $ g $ g它读取的文件，它将 File.relative 传递给multimatch函数（这是相对于 File.base ，这相当于第一个glob）。所以当我使用'bower_components / foundation / scss / normalize.scss'作为glob File.relative 时，只包含文件名和'bower_components / foundation / scss / normalize.scss'不符合'normalize.scss' 。

I'm working on moving my workflow over to Gulp, and I'm loving it so far; however, I seem to have misunderstood something about how the gulp-filter plugin works...

I have the following task:

gulp.task('assets', function() {
    var stylesFilter = gulpFilter(stylesPath);
    var imagesFilter = gulpFilter(imagesPath);
    var scriptsFilter = gulpFilter(scriptsPath);

    return gulp.src([].concat('app/**/*.html', stylesPath, imagesPath, scriptsPath))
        // STYLES
        .pipe(stylesFilter)
        .pipe(gulp.dest('dist/test_styles')) // For debugging!
        .pipe(sass({style: 'expanded' }))
        .pipe(autoPrefixer('> 1%', 'last 3 versions', 'Firefox ESR', 'Opera 12.1'))
        .pipe(concat('main.css'))
        .pipe(minifyCss())
        .pipe(rev())
        .pipe(revReplace())
        .pipe(gulp.dest('dist/css'))
        .pipe(stylesFilter.restore())

        // SCRIPTS
        .pipe(scriptsFilter)
        .pipe(gulp.dest('dist/test_scripts')) // For debugging!
        .pipe(jsHint('.jshintrc'))
        .pipe(jsHint.reporter('jshint-stylish'))
        .pipe(concat('app.js'))
        .pipe(uglify())
        .pipe(rev())
        .pipe(revReplace())
        .pipe(gulp.dest('dist/js'))
        .pipe(scriptsFilter.restore())

        // IMAGES
        .pipe(imagesFilter)
        .pipe(gulp.dest('dist/test_images')) // For debugging!
        .pipe(cache(imageMin({ optimizationLevel: 7, progressive: true, interlaced: true })))
        .pipe(rev())
        .pipe(revReplace())
        .pipe(gulp.dest('dist/img'))
        .pipe(imagesFilter.restore());
});

The path variables I'm using are defined as follows:

var stylesPath = [
    'bower_components/foundation/scss/normalize.scss', 
    'bower_components/foundation/scss/foundation.scss',
    'app/styles/app.scss'
],
scriptsPath = [
    'app/scripts/**/*.js',
    '!app/scripts/**/*_test.js'
],
imagesPath = [
    'app/images/**/*'
];

My problem is that the stylesFilter, imagesFilter, and scriptsFilter are filtering out everything! I've tried adding the lines marked as "for debugging" in the task above in order to see which files it is working on in each filtered section, which shows that all files are being filtered out (i.e. no files are written to disk with the gulp.dest() statements marked as being for debugging above). If I add a line for outputting the files after any of the .pipe(*Filter.restore()) lines it outputs all the files from the original input (which are the correct files). I've also, for good measure, tried using a negated pattern for the filters, but that had the exact same result.

So what am I missing? Why is nothing returned by the filters?

解决方案

OK, so I've found the reason for this behavior:

gulp-filter uses the multimatch module behind the scenes, and it uses Vinyl file objects for the files it reads, and it passes File.relative to the multimatch function (which is the relative path in relation to File.base, which is equal to the first glob). So when I used 'bower_components/foundation/scss/normalize.scss' as a glob File.relative only contained the file name, and 'bower_components/foundation/scss/normalize.scss' doesn't match 'normalize.scss'.

这篇关于gulp-filter过滤掉所有的文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！