是否可以在 Gulp 中忽略带有 unCSS 的文件？

Question

我一直在 google 寻找一种方法来做我想做的事，但没有成功。

这是我的 gulp 任务

    gulp.task('less', function() {
    return gulp.src('css/*.less')
        .pipe(less())
        .pipe(stripCssComments({
            all: true
        }))
        .pipe(concat('main.css'))
        .pipe(uncss({
            html: ['index.html'],
            ignore: [
                '.visited',
                '.ripple',
                '.rippleEffect',
                '.ripple2',
                '.rippleEffect2',
                '.rippleDrop', '.rippleDrop2',
                '.ripple3',
                '.rippleEffect3',
                '.rippleDrop3',
                '.slide'
            ]
        }))
        .pipe(minifyCSS())
        .pipe(gulp.dest('build/css'))
});

如您所见，我已经有很多类需要忽略。但是我的新 css 框架变得更糟了，它有几十个 javascript 调用的类（所以 uncss 会删除它们）。我不想在我的忽略选项中放置 30 类，而是忽略包含动态类的 .css。

关键是，我仍然希望我的 events.css 与其他 css 连接起来，所以它必须进入管道（我想要一个 .css 文件对于我所有的网站）。

或者我应该制作第二个 .less 函数，它将 uncss 文件与非 uncss 文件合并？我不确定什么是实现我想要的最好方法

Answer 1

最后一点实际上是要去做的，但你不必做两个功能，你可以使用流合并：

var merge = require('merge2');

gulp.task('less', function() {
    var streamMain = gulp.src(['css/*.less', '!css/events.less'])
        .pipe(less())
        .pipe(stripCssComments({
            all: true
        }))
        .pipe(uncss({
            html: ['index.html']
        }));

    var streamEvents = gulp.src('css/events.less')
        .pipe(less())
        .pipe(stripCssComments({
            all: true
        }));

    return merge(streamMain, streamEvents)
        .pipe(concat('main.css'))
        .pipe(minifyCSS())
        .pipe(gulp.dest('build/css'));
});

在Gulp中，插件应该只做一件事。与处理文件有关的一切实际上都在您手中:-)

是否可以在 Gulp 中忽略带有 unCSS 的文件？

Is it possible to ignore a file with unCSS in Gulp?

html

javascript

css

gulp

uncss