Css 如何在Gulp中匹配并返回具有各种扩展名的文件？

我试图返回扩展名为.css和.styl的文件，这些文件位于不同的文件夹中，并在一次吞咽任务中使用它们，但没有成功。我想知道我做错了什么？这是我在这一点上的代码：

var pattrn = /(styl|css)$/g;
var path1 = './dev/**/';

var paths = {
  dev_styles: path1.match( pattrn ),
  build: './build'
};

gulp.task( 'styles', function() {
  var processors = [
    csswring,
    autoprefixer( { browsers: [ 'last 2 version' ] } )
];

return gulp
  .src( paths.dev_styles )
  .pipe( plugins.postcss( processors ) )
  .pipe( plugins.rename( { suffix: '.min'} ) )
  .pipe( gulp.dest( paths.build ) );
});

我得到这个错误：

Error: Invalid glob argument: null

---

好吧，你的问题是那不是吞咽的方式

检查about gulp.src，它指出：

src（globs[，options]）接受要读取的glob或glob数组

这意味着您不需要进行奇怪的过滤，指定一个合适的过滤器就足够了

回到您的问题，这将解决它：

gulp.task( 'styles', function() {
  var processors = [
    csswring,
    autoprefixer( { browsers: ['last 2 version' ] } )
  ];
  return gulp
    .src( 'root_to_styl_files/**/*.styl' ) // Will get all .styl files in the specified folder & subfolders
    .pipe( plugins.postcss( processors ) )
    .pipe( plugins.rename( { suffix: '.min' } ) )
    .pipe( gulp.dest( './build' ) );
});

---

Globs的数组是解决方案。正如上面avcajaraville所建议的，不需要正则表达式。这里有一个完成这项工作的片段：

.src(['./root_to_files/**/*.css', './root_to_files/**/*.styl']),

这将返回与模式匹配的文件，并使它们可以被任何gulp插件进一步处理（管道）。如果没有进一步的处理（如展平、清理等），它们最终将被放在目标文件夹（dest）上，并复制原始文件夹结构

---

我以前试过，它能起作用，但并不完全符合预期。它将已处理的.styl和.css文件放在不同的文件夹中（复制每个已处理文件的原始文件夹结构），而不是将它们连接起来并返回单个文件。恰巧，gulp concat做到了这一点。将两个文件.styl和.css连接起来似乎并不太好，所以我结束了将文件分开的过程，只是用gulp Flatte将文件夹结构展平。无论如何，谢谢你的链接和提示，这是当场！

.pipe(gulp.dest('./build'));