html - Gulp Uncss 破坏了 Bootstrap 下拉导航栏导航

Question

我想在我的一个大 css 文件上使用 uncss，但这样做会破坏我的 Bootstrap 导航的下拉菜单。

这是工作部分:http://metalotechnika.com

这是我使用 uncss 的部分:http://metalotechnika.horyzon.de .

您会注意到下拉菜单不起作用。它使用 Twitter Bootstrap 导航栏。

我的 gulpfile 部分如下所示:

gulp.task('uncss', function() {
    return gulp.src('style.css')
        .pipe(uncss({
            html: ['uncss/uncss.html']
        }))
        .pipe(gulp.dest(''));
});

即使我在这里选择一个 URL，它也会中断。我暂时禁用了生产站点上的缓存和 css 压缩，这样您就可以看到 style.css 中的重要区别，也就是获得“uncss”。

如何使用 uncss 减少我的 css？为什么它会损坏，我该如何解决？

Answer 1

将菜单使用的类添加到忽略列表如下所示:

gulp.task('uncss', function() {
return gulp.src('style.css')
    .pipe(uncss({
        html: ['uncss/uncss.html'],
        ignore: [
            ".fade",
            ".fade.in",
            ".collapse",
            ".collapse.in",
            ".collapsing",
            /\.open/
       ]
    }))
    .pipe(gulp.dest(''));

});

来自这个线程:https://github.com/giakki/uncss/issues/64

您可以根据需要在列表中添加或删除类。