Gulp Uncss 中断 Bootstrap 下拉导航栏导航
Gulp Uncss Breaks Bootstrap Dropdown Navbar Navigation
我想在我的一个大 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?为什么它会损坏,我该如何解决?
将菜单使用的 类 添加到忽略列表将如下所示:
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
您可以根据需要在列表中添加或删除 类。
对我来说,以下忽略列表有效 - 我添加了 /\.dropdown/
:
gulp.task('uncss', function() {
return gulp.src('style.css')
.pipe(uncss({
html: ['uncss/uncss.html'],
ignore: [
".fade",
".fade.in",
".collapse",
".collapse.in",
".collapsing",
/\.open/,
/\.dropdown/
]
}))
.pipe(gulp.dest(''));
});
我想在我的一个大 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?为什么它会损坏,我该如何解决?
将菜单使用的 类 添加到忽略列表将如下所示:
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
您可以根据需要在列表中添加或删除 类。
对我来说,以下忽略列表有效 - 我添加了 /\.dropdown/
:
gulp.task('uncss', function() {
return gulp.src('style.css')
.pipe(uncss({
html: ['uncss/uncss.html'],
ignore: [
".fade",
".fade.in",
".collapse",
".collapse.in",
".collapsing",
/\.open/,
/\.dropdown/
]
}))
.pipe(gulp.dest(''));
});