stylelint 本身不内置 bem 校验能力，必须依赖 selector-class-pattern 规则或 stylelint-selector-bem-pattern 插件；前者靠自定义正则匹配类名格式，后者可校验 block-element 的语义归属关系。
Stylelint 本身不内置 BEM 校验能力，必须靠 selector-class-pattern 规则或 stylelint-selector-bem-pattern 插件来实现——选哪个，取决于你是否需要上下文感知（比如 block 和 element 是否真实存在）。
selector-class-pattern 能否覆盖真实 BEM 场景？
能，但正则必须自己写准，官方示例太宽松，直接套用会漏检或误报。
- 基础 BEM（block__elem--mod）推荐正则：
"^[a-z][a-zA-Z0-9]+(__[a-z][a-zA-Z0-9]+)?(--[a-z][a-zA-Z0-9]+)?$" - 混用 utility 类（如
u-margin-top-16）需扩展："^(u-[a-z][a-zA-Z0-9]+|([a-z][a-zA-Z0-9]+(__[a-z][a-zA-Z0-9]+)?(--[a-z][a-zA-Z0-9]+)?))$" - 禁止用
class-name-pattern——这是旧版别名，v14+ 会报Invalid options object - 别开
selector-max-id或max-nesting-depth，它们和命名无关，只会干扰 BEM 检查
stylelint-selector-bem-pattern 插件值不值得加？
值得，但仅当你需要检测“块是否存在”“元素是否属于该块”这类语义关系时才真正有用；纯正则做不到这点。
- 安装：
npm install stylelint-selector-bem-pattern --save-dev - 配置里启用插件并设
"preset": "bem"，它会自动校验.block__elem是否有对应.block - 注意：Vue 单文件组件中动态拼接类名（如
:class="['card', `card--${status}`]"）仍需 JS 侧配合工具函数生成，插件无法校验字符串拼接结果 - 这个插件已多年未维护，若项目用的是 PostCSS 8+ 或 Stylelint v15+，先跑
npx stylelint --version和插件文档对版本兼容性
pre-commit 钩子里怎么只扫本次提交的 CSS 文件？
不做过滤就扫全量目录，要么超命令行长度限制，要么误伤未修改文件；Git 默认也不把 CSS 加进暂存区，得主动捞。
- 用
git diff --cached --name-only --diff-filter=ACM | grep '\.css$'提取本次新增/修改/重命名的 CSS 文件 - 脚本开头必须加
cd $(git rev-parse --show-toplevel)，否则stylelint找不到.stylelintrc.json - 绝对不要写
stylelint "**/*.css"——shell 展开会崩，且无法限定在暂存区 -
stylelint --fix禁止在 pre-commit 里运行：它改文件但不重新git add，提交内容仍是错的，还会污染开发者本地工作区
为什么 WebStorm / VS Code 里没提示？
不是插件没装，而是 IDE 没加载到你项目的 Stylelint 实例或配置文件。
- WebStorm 必须手动指定
Stylelint package路径为node_modules/stylelint（不是.bin/stylelint） - VS Code 的 Stylelint 插件默认走全局，项目级配置要确认启用了
stylelint.enable并设置了stylelint.configFile - 支持
.vue或.scss？得在 IDE 设置里显式加扩展名：**/*.{css,scss,vue}，且 Vue 项目需额外配postcss-html解析器 - 配置文件路径填错、语法错误、或
stylelint-config-standard版本不匹配（v15+ 要 v30+ config），都会导致规则静默失效
BEM 校验最难的不是写正则，而是让规则在开发者真正写代码的瞬间起作用——编辑器提示延迟半秒、pre-commit 多扫一个文件、utility 类被误杀一次，都可能让人绕过检查。所以配置上线前，务必用真实组件类名跑一遍，尤其关注嵌套 modifier 和第三方库类名的豁免逻辑。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
