stylelint 默认无法精准校验 bem，必须安装 stylelint-selector-bem-pattern 插件并严格配置 preset、componentname 和 ignoreselectors 三项参数，否则 .btn-primary、.userlist 等非bem写法将全部漏检。
不能只靠 stylelint 自带规则检测 BEM，必须装插件、配参数、绕例外——否则 .btn-primary 和 .userList 全部逃过检查。
为什么 selector-class-pattern 无法精准识别 BEM 结构
内置 selector-class-pattern 只做字符串正则匹配，它分不清 .card__image（合法 BEM）和 .card-image（非法但正则可能放过）的语义差异。它也不会拒绝 .Card 或 .user-list 这类违反块名小写约定的写法。
- 官方示例正则
"^[a-z][a-zA-Z0-9]+(__[a-z][a-zA-Z0-9]+)?(--[a-z][a-zA-Z0-9]+)?$"看似合理，但漏掉对 block 名首字母小写、无破折号、无下划线的强制校验 - 不启用
plugin/selector-bem-pattern插件，stylelint对 BEM 实际处于“睁眼瞎”状态 - 即使开了插件，若
"componentName"写成"[A-Z]+"，就会允许.Button，直接违背 BEM 原则
必须配置的三项插件参数
stylelint-selector-bem-pattern 不是开箱即用，少一个字段都会让规则失效。
-
"preset": "bem"：必须显式指定，不是默认值；填"suit"或留空会导致模式错位 -
"componentName": "[a-z][a-zA-Z0-9]*"：限定块名只能小写字母开头，禁止.User、.user-list、.user_list -
"ignoreSelectors": ["/^\..+:(hover|focus|active|disabled|visited)$/", "/^\.ant-.+$/"]：否则.btn:hover和第三方类名（如.ant-btn）全被误报
pre-commit 钩子里怎么只查本次提交的 CSS 文件
直接跑 stylelint "**/*.css" 会扫全量文件，既慢又不准，还可能因命令行长度超限崩溃。
- 先用
git diff --cached --name-only --diff-filter=ACM提取暂存区中真正要提交的文件 - 加管道过滤：
| grep '.css$'（单引号防 shell 展开） - 脚本开头必须
cd $(git rev-parse --show-toplevel)切到仓库根，否则stylelint找不到配置或解析路径失败 - 禁用
--fix：它改文件但不自动git add，导致违规代码照常提交，且污染本地工作区
VS Code 里
默认情况下，stylelint 完全忽略 Vue/Svelte 单文件组件里的 <style></style> 块，不是插件问题，是没告诉它“这里面是 CSS”。
- 装对应处理器：
npm install --save-dev stylelint-processor-html（Vue）或stylelint-processor-svelte（Svelte） - 在
.stylelintrc.js中加字段：processor: "stylelint-processor-html" - 确保 VS Code 当前文件语言模式是小写的
vue，不是Vue或Plain Text；右下角点击切换 - 如果用了
.module.scss后缀，还需在overrides里配customSyntax: "postcss-scss"
BEM 校验最易被忽略的点：插件参数缺一不可、第三方类名必须显式 ignore、--fix 在 pre-commit 里必须关——它不是修不好，而是修了反而让 Git 状态变脏。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
