如何配置Stylelint禁止选择器列表中各选择器间出现多余空行

解决方法 #

你只需要在现有配置的rules字段中添加"selector-max-empty-lines": 0即可，该规则会限制选择器列表中相邻选择器之间的空行数量为0，完全禁止空行出现。配合你已有的selector-list-comma-newline-after: "always"规则，正好实现你期望的格式化效果。如果需要自动批量修复现有不符合规范的代码，运行Stylelint时加上--fix参数即可自动删除选择器之间的多余空行。

修改后的完整配置参考 #

{
  "extends": "stylelint-config-property-sort-order-smacss",
  "plugins": ["stylelint-order", "stylelint-scss"],
  "rules": {
    "color-hex-case": "lower",
    "block-no-empty": true,
    "font-weight-notation": "numeric",
    "length-zero-no-unit": true,
    "declaration-block-no-duplicate-properties": true,
    "declaration-colon-space-after": "always",
    "declaration-colon-space-before": "never",
    "declaration-block-semicolon-space-before": "never",
    "declaration-bang-space-before": "always",
    "declaration-block-no-shorthand-property-overrides": true,
    "declaration-empty-line-before": "never",
    "block-opening-brace-newline-after": "always",
    "block-closing-brace-space-before": "always-single-line",
    "block-closing-brace-newline-after": "always",
    "block-closing-brace-newline-before": "always",
    "selector-list-comma-newline-after": "always",
    "selector-max-empty-lines": 0,
    "rule-empty-line-before": ["always", {
      "except": ["first-nested"]
    }],
    "string-quotes": "single",
    "color-named": "never",
    "indentation": 2,
    "no-invalid-double-slash-comments": true,
    "shorthand-property-no-redundant-values": true,
    "selector-combinator-space-after": "always",
    "selector-combinator-space-before": "always"
  }
}

内容的提问来源于stack exchange，提问作者sunpietro