结论是：应使用 .stylelintrc.js 而非 json，优先启用 property-no-unknown、length-zero-no-unit、declaration-block-no-duplicate-properties 三条规则，可拦截90%低级 bug；因 js 配置支持注释、环境判断、动态导入和变量复用，而 json 无法满足实际工程需求。
直接说结论：用 .stylelintrc.js 而不是 JSON，规则从 property-no-unknown、length-zero-no-unit、declaration-block-no-duplicate-properties 这三条起步，别一上来就 extend 全量配置——90% 的低级 Bug 就靠它们拦住。
为什么必须选 .stylelintrc.js 而不是 JSON
JSON 看似简单，但实际开发中很快会卡死：没法写注释说明某条规则为什么开/关，不能根据环境（如是否在组件库项目里）动态开关 declaration-no-important，更没法 require 团队共享的规则包或复用变量。而 JS 文件导出一个对象就行，比如：
module.exports = {
extends: ['@frontlint/stylelint'],
ignoreFiles: ['**/node_modules/**', '**/dist/**'],
rules: {
'color-hex-case': 'lower',
'selector-class-pattern': '^([a-z][a-z0-9]*)(-[a-z0-9]+)*$'
}
};
常见错误是只写 module.exports = {} 却没填 rules 或 extends 字段，导致整个配置静默失效；还有人把 overrides 写进去了，却忘了配 files 字段，结果 SCSS 文件压根不被扫到。
property-no-unknown 为什么排第一位
它能立刻捕获 dispay: flex、backgroud-color: #fff 这类拼写错误，成本为零，收益极高。但要注意两点：
- 如果你用了 CSS-in-JS 或自定义属性（如
--primary-color），得配合custom-property-pattern规则，否则--foo会被当成未知属性报错 - 某些 PostCSS 插件生成的属性（如
-webkit-line-clamp）需要显式加进property-unknown-ignore-regex，不然 CI 里总飘红 - 该规则默认不检查自定义语法（如 SCSS 变量
$color），要校验变量名得靠scss/dollar-variable-pattern插件
SCSS/Less 文件怎么正确启用 Stylelint
命令行跑 stylelint **/*.scss 成功 ≠ 编辑器里有提示。VS Code 和 WebStorm 都默认只认 .css，必须手动干预：
- VS Code 的
settings.json里，stylelint.validate必须显式列出"scss"，不能只写["css"] - WebStorm 中，
Stylelint package路径必须指向node_modules/stylelint（不是.bin/stylelint），且Run for files要填**/*.css;**/*.scss，改完必须重启 IDE - 如果项目混用多种预处理器，用
overrides比全局 extend 更安全，例如对**/*.less关掉scss/at-import-partial-extension类规则，避免误报
CI 里 Stylelint 报错但本地不报，通常卡在哪
最常被忽略的是 Node 版本和 stylelint 版本不一致。v16+ 的 stylelint 默认不解析 .scss，必须装 stylelint-scss 并在配置里加 plugins: ['stylelint-scss']；而本地开发可能用了 pnpm 或 nvm 切了旧版 Node，导致 CLI 行为不一致。另一个隐形坑是 .stylelintignore 里写了 !src/**/*.scss，但路径匹配依赖 node-ignore，! 否定规则必须写在对应 ignore 规则之后，顺序错了就白写。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
