如何从stylelint-config-recommended中挑选Top10常用CSS校验规则？

这些规则都是从stylelint-config-recommended里筛选出的最常用、最能解决实际问题的基础语法校验规则，既能帮你规避常见CSS错误，又不会因为过度约束风格产生大量整改任务：

• block-no-empty：禁止空的代码块，避免写无效的空样式
• color-no-invalid-hex：拦截无效的十六进制颜色值，比如#fff1这种不合法的写法
• comment-no-empty：清理空注释，减少代码里的冗余内容
• declaration-block-no-duplicate-properties：禁止同一个声明块里重复写相同属性，避免样式冲突或冗余代码
• declaration-block-no-shorthand-property-overrides：防止用简写属性覆盖之前的具体属性，比如先写padding-top: 10px再写padding: 0导致的意外样式覆盖
• font-family-no-duplicate-names：禁止字体族列表里出现重复的字体名称，精简代码
• function-calc-no-unspaced-operator：要求calc()函数里的运算符两侧必须有空格，保证语法规范和可读性
• function-no-unknown：拦截未知的CSS函数，比如把rgb()写成rbg()这种拼写错误
• selector-pseudo-class-no-unknown：禁止使用不存在的伪类选择器，避免选择器语法错误
• unit-no-unknown：拦截未知的CSS单位，比如把px写成pxx这种低级错误

你可以直接在项目的.stylelintrc里配置这些规则：

{
  "rules": {
    "block-no-empty": true,
    "color-no-invalid-hex": true,
    "comment-no-empty": true,
    "declaration-block-no-duplicate-properties": true,
    "declaration-block-no-shorthand-property-overrides": true,
    "font-family-no-duplicate-names": true,
    "function-calc-no-unspaced-operator": true,
    "function-no-unknown": true,
    "selector-pseudo-class-no-unknown": true,
    "unit-no-unknown": true
  }
}

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