Skip to main content

no-duplicate-selectors

禁止重复的选择器。

¥Disallow duplicate selectors.

    .foo {} .bar {} .foo {}
/** ↑               ↑

 * These duplicates */

此规则检查两种类型的重复：

¥This rule checks for two types of duplication:

  • 单个选择器与规则的选择器列表的重复，例如 a, b, a {}。

    ¥Duplication of a single selector with a rule's selector list, e.g. a, b, a {}.

  • 样式表中选择器列表的重复，例如 a, b {} a, b {}。即使选择器的顺序不同或间距不同，例如，也会发现重复项。 a d, b > c {} b>c, a d {}。

    ¥Duplication of a selector list within a stylesheet, e.g. a, b {} a, b {}. Duplicates are found even if the selectors come in different orders or have different spacing, e.g. a d, b > c {} b>c, a d {}.

在以下情况下允许重复相同的选择器：

¥The same selector is allowed to repeat in the following circumstances:

  • 它用于不同的选择器列表，例如 a {} a, b {}。

    ¥It is used in different selector lists, e.g. a {} a, b {}.

  • 重复项被确定源自不同的样式表，例如 你已经以生成源映射供 PostCSS 读取的方式连接或编译了文件，例如 postcss-导入。

    ¥The duplicates are determined to originate in different stylesheets, e.g. you have concatenated or compiled files in a way that produces sourcemaps for PostCSS to read, e.g. postcss-import.

  • 重复项位于具有不同父节点的规则中，例如 媒体查询的内部和外部。

    ¥The duplicates are in rules with different parent nodes, e.g. inside and outside of a media query.

此规则解析嵌套选择器。所以 a b {} a { & b {} } 算作一个问题，因为解析的选择器最终会出现重复。

¥This rule resolves nested selectors. So a b {} a { & b {} } counts as a problem, because the resolved selectors end up with a duplicate.

message 次要选项 可以接受该规则的参数。

¥The message secondary option can accept the arguments of this rule.

选项​

¥Options

true​

以下模式被视为问题：

¥The following patterns are considered problems:

.foo,
.bar,
.foo {}
.foo {}
.bar {}
.foo {}
.foo .bar {}
.bar {}
.foo .bar {}
@media (min-width: 10px) {
  .foo {}
  .foo {}
}
.foo, .bar {}
.bar, .foo {}
a .foo, b + .bar {}
b+.bar,
a
  .foo {}
a b {}
a {
  & b {}
}

以下模式不被视为问题：

¥The following patterns are not considered problems:

.foo {}
@media (min-width: 10px) {
  .foo {}
}
.foo {
  .foo {}
}
.foo {}
.bar {}
.foo .bar {}
.bar .foo {}
a b {}
a {
  & b,
  & c {}
}

可选的辅助选项​

¥Optional secondary options

disallowInList: true | false（默认：false）​

¥disallowInList: true | false (default: false)

此选项还将禁止选择器列表中出现重复的选择器。

¥This option will also disallow duplicate selectors within selector lists.

例如，true。

¥For example, with true.

以下模式被视为问题：

¥The following patterns are considered problems:

input, textarea {
  border: 2px;
}
textarea {
  border: 1px;
}