为什么unss忽略不正常?

时间:2015-12-22 10:12:56

标签: gruntjs uncss

对于我的网站,我使用uncss删除未使用的bootstrap-css。但是我的导航中有两个元素 - bootstrap carousel 幻灯片动画和活动状态,这在unss生成新的css文件后无法正常工作。

继承我的无用 - 忽略

ignore: [
    ".tab",
    ".tab-content",
    ".tab-pane",
    ".fade",
    ".fade.in",
    ".collapse",
    ".collapse.in",
    ".collapsing",
    ".open",
    "/open+/",
    ".start",
    ".start .container-shadow",
    ".active",
    ".embed-responsive-item",
    ".embed-responsive",
    ".embed-responsive-16by9",
    ".schmerzfrei iframe",
    ".embed-responsive .embed-responsive-item",
    ".embed-responsive embed",
    ".embed-responsive object",
    ".embed-responsive iframe",
    ".embed-responsive video",
    ".highlight a:hover:after, .highlight a:focus:after, .highlight.active a:after",
    ".carousel-inner > .next",
    ".carousel-inner > .prev",
    ".carousel-inner > .next",
    ".carousel-inner > .prev",
    ".carousel-inner > .next.left",
    ".carousel-inner > .prev.right",
    ".carousel-inner > .active.left",
    ".carousel-inner > .active.right",
    ".carousel-inner>.item.active",
    ".carousel-inner>.item.next.left",
    ".carousel-inner>.item.prev.right",
    ".bs.carousel",
    ".slid.bs.carousel",
    ".slide.bs.carousel"
]
}

这是我的css,这是必要的,但不会被uncss识别

.highlight a:hover:after, .highlight a:focus:after, .highlight.active a:after {
    height: 0px;
    -webkit-transition: .3s cubic-bezier(0.71, -0.58, 0.07, 1.29);
    -moz-transition: .3s cubic-bezier(0.71, -0.58, 0.07, 1.29);
    -ms-transition: .3s cubic-bezier(0.71, -0.58, 0.07, 1.29);
    -o-transition: .3s cubic-bezier(0.71, -0.58, 0.07, 1.29);
    transition: .3s cubic-bezier(0.71, -0.58, 0.07, 1.29)
}

任何评论或帮助都会很棒!

1 个答案:

答案 0 :(得分:0)

根据https://github.com/giakki/uncss/issues/140,uncss不会剥离那些有伪元素的选择器,因此不需要在忽略列表中指定所有这些,并且可能将它们放在忽略列表中也不会这样做任何东西。

您可以尝试替换

<!-- TabItem Style -->
<Style x:Key="styleTabItem" TargetType="{x:Type TabItem}">
    <Style.Resources>
        <SolidColorBrush x:Key="brushForUnderline" Color="Gold" />
    </Style.Resources>
    <Setter Property="Template" Value="{StaticResource ctrlTemplate}" />
</Style>

".highlight a:hover:after, .highlight a:focus:after, .highlight.active a:after"

这应该与您的选择器相匹配,并且更容易阅读。