Stylelint，非嵌套规则之前有一个空行，并且嵌套规则之前没有空行？

Question

现在有什么办法可以实现这一点吗？

我看到由于某种原因，rule-nested-empty-line-before 已被删除，那么这个配置不再可能了吗？

我希望这会引发错误...

@media (max-width: 300px) {

    .foo {
        display: block;
    }
}
@media (max-width: 600px) {
    .bar {
        display: block;
    }
}

@media 之前应该有一个空格，因为它不是嵌套的，并且 .foo 之前没有空格，因为它是嵌套的。

Answer 1

和规则合并在一起形成rule-nested-empty-line-before版本中的新规则。您可以使用此规则来控制和规则之前的空行。rule-non-nested-empty-line-beforerule-empty-line-before8.0.0.foo {}.bar {}

@media是一个at规则，所以你应该使用该at-rule-empty-line-before规则来控制它前面的空行。

您可以在用户指南的本节中了解规则的命名方式以及它们如何协同工作。

@media 之前应该有一个空格，因为它不是嵌套的，并且 .foo 之前没有空格，因为它是嵌套的。

考虑到上述内容，其配置应该是：

{
  "rules": {
    "at-rule-empty-line-before": ["always"],
    "rule-empty-line-before": ["always", {
      except: ["first-nested"]
    }]
  }
}

或者，您可以使用stylelint-standard-config，它具有合理的样式规则默认值。