忽略空 css 文件

Question

我正在使用 gulp 从 less 文件生成 css 和 min.css 文件。然而，一些 less 文件没有 css 输出（比如 variables.less 只是定义导入变量）。

有没有办法跳过此文件的空 css 流输出？

这是编译所有less文件的当前代码：

var config = {
    lessSrc: './Content/**/*.less'
};

gulp.task('css:lessmin', function () {
    gulp.src(config.lessSrc, { base: '.' })
        .pipe(less())
        .pipe(gulp.dest('.'))
        .pipe(minifyCss())
        .pipe(rename({ suffix: '.min' }))
        .pipe(gulp.dest('.'));
});

我可以将 lessSrc 更改为仅指定我要编译的文件或忽略我不想生成 css 和 min.css 文件的文件，但我有很多情况那，不仅仅是在较少的文件中。

Answer 1

一个不错的选择是使用过滤器，过滤通配集的空结果：

var gulp = require('gulp');
var filter =  require('gulp-filter');
var less = require('gulp-less');

gulp.task('less', function() {
  return gulp.src('*.less')
    .pipe(filter(function(file) {
      return file.stat && file.contents.length;
    }))
    .pipe(less())
    .pipe(gulp.dest('.'));
});

您将虚拟文件对象传递给您的流，每个虚拟文件对象都包含文件的内容和信息。 stat 对象不仅告诉您它已经加载，而且还告诉您它是否是一个文件。内容是一个缓冲区。通过长度，您可以检查其中是否真的有任何内容。注意：这对处理空格没有帮助。该文件必须确实为空。

忽略空 css 文件

Ignore empty css files

css

less

gulp