angularjs - 为什么 gulp-filter 不能过滤掉我的 bower 包中的更少文件

Question

我正在尝试使用 main bower files 获取我的 Bower 组件中的所有文件并使用 gulp-filter 根据类型过滤它们.当我像这样过滤掉 js 文件时它工作正常:

gulp.task('bower_js', function() {
  var jsFilter = gulpFilter('**/*.js');
  gulp.src(mainBowerFiles(), {base: './bower_components'})
    .pipe(jsFilter)
    .pipe(concat('vendor.js'))
    .pipe(gulp.dest('./_public/js'));
});

但是以更少的成本运行类似的任务是行不通的(即没有任何东西通过过滤器):

gulp.task('bower_css', function() {
  var lessFilter = gulpFilter('**/*.less');
  gulp.src(mainBowerFiles(), {base: './bower_components'})    
    .pipe(lessFilter)
     // .pipe(less()) commented to narrow down the problem
    .pipe(concat('app.css'))
    .pipe(gulp.dest('./_public/css'));
});

虽然如果我在没有任何过滤器的情况下运行 mainBowerFiles.. 它会将 .less 文件内容转储到我的目标文件夹中..

举一个具体的例子。这是我的一个 bower 包的 bower.json 的相关部分:bootstrap:

  "main": [
    "less/bootstrap.less",
    "dist/css/bootstrap.css",
    "dist/js/bootstrap.js",
    "dist/fonts/glyphicons-halflings-regular.eot",
    "dist/fonts/glyphicons-halflings-regular.svg",
    "dist/fonts/glyphicons-halflings-regular.ttf",
    "dist/fonts/glyphicons-halflings-regular.woff"
  ],

bootstrap.less 依次导入其他文件:

// Core variables and mixins
@import "variables.less";
@import "mixins.less";

// Reset and dependencies
@import "normalize.less";
@import "print.less";
..

等等。

有什么想法吗？

Answer 1

我一直在尝试获得类似于 SASS 的东西，但没有成功。直到我发现 main-bower-files 现在有一个 filter option内置。这是一个正则表达式。尝试这样的事情而不是使用 gulp-filter:

gulp.task('bower_css', function() {
  var lessRegEx = (/.*\.less$/i);
  gulp.src(mainBowerFiles({filter: lessRegEx}), {base: './bower_components'})    
     // .pipe(less()) commented to narrow down the problem
    .pipe(concat('app.css'))
    .pipe(gulp.dest('./_public/css'));
});