gruntjs - UNCSS 无法与多个类选择器一起正常工作

Question

我正在使用 多类选择器 对于我的 angular js 应用程序中的某些元素，如下所示:

<p class="first second">som text</p>

在我的 CSS 文件中，我有 .first 和 .first.second 的其他更具体的属性:

.first{
   ...
}

.first.second{
   ...
}

我的问题是当我运行 grunt uncss 时， 生成的文件 阅读 .first 和 .second 类，但不是像 这样的两者一起.first.second 问题是我一直在使用这种方法，并且我的应用程序中有数千个这样的选择器。

如何配置 uncss 以忽略使用多个类定义的所有选择器，而无需在 uncss 忽略选项中一一编写？

是否有任何我不知道的配置约定？

谢谢!

Answer 1

首先，您不能一次性编写类。有一个规则要遵守，所以写 .first.second 完全行不通，因为类符号之间必须有一个空格 -> .first .second

这意味着，您需要这样的标记:

<div class = "first">
    <div class = "second"></div>
</div>

ID 和元素不必有空格 -> #myDiv.first, div.second

其次，使用给定的标记，您标记 CSS 的方式没有意义，因为您处理的是相同的元素。

所以，对于这样的标记:

<p class="first second">som text</p>

例如，您必须像这样编写它:

.first
    {
        color: #333333;
    }

.second
    {
        text-decoration: underline;
    }

通过这种方式，您可以交换类并构建更多样式。