Stylelint 在 WebStorm 中需手动配置项目内实例路径、扩展文件匹配模式、显式指定配置文件及启用命名规则，否则不生效；保存或失焦后才触发检查。
Stylelint 在 WebStorm 里不是装完插件就自动生效的，关键在于让 IDE 正确加载你项目里的 stylelint 实例和配置。路径错、配置没被识别、文件匹配漏掉扩展名——任一环节出问题，编辑器就“静音”，看着启用了，实际不报错。
WebStorm 找不到本地 stylelint 包怎么办
最常见的情况是：勾了 Enable，但右下角没提示，写个 color: red; 也不标红。这是因为 WebStorm 默认尝试用全局 stylelint，而你装的是 --save-dev 到项目 node_modules 里。
必须手动指定路径：
- 打开
Settings → Languages & Frameworks → Style Sheets → Stylelint - 在
Stylelint package字段点右侧文件夹图标 - 定位到项目下的
node_modules/stylelint（不是node_modules/.bin/stylelint） - 确认路径末尾是
stylelint目录，不是可执行文件
如果路径正确但依然失效，检查终端是否能跑通 npx stylelint --version；若报错，说明 node_modules 没装全或 Node.js 解释器没配对（Settings → Languages & Frameworks → Node.js 需指向项目所用版本）。
Run for files 模式不匹配 SCSS/Vue 等非纯 CSS 文件
默认只扫 **/*.css，哪怕你项目全是 .scss 或 .vue 单文件组件，也不会触发检查。
立即学习“前端免费学习笔记（深入）”；
要支持其他类型，必须显式修改匹配模式：
- 在
Run for files输入框中填入：**/*.{css,scss,sass,vue,less} - 注意：不能只加
scss，得保留原有css，否则纯 CSS 文件反而失效 - Vue 文件需额外确保已安装
stylelint-processor-styled-components或postcss-html并在配置中启用对应customSyntax
改完别跳过重启步骤——WebStorm 不会热重载这个配置，必须关闭再打开一个 .scss 文件才能验证是否生效。
配置文件（如 stylelint.config.js）不被识别
即使 stylelint 包路径对了，也扫文件了，但规则还是没按你预期跑，大概率是配置没加载上。
WebStorm 不完全依赖自动查找机制，尤其当项目有多个配置文件（比如根目录和子目录都有 .stylelintrc.json）时容易误读。
- 在
Configuration file字段手动填绝对路径，例如：$ProjectFileDir$/stylelint.config.js - 确保该文件导出的是有效对象，且没有语法错误（
require失败会导致静默失败） - 如果用
stylelint-config-standard，确认node_modules/stylelint-config-standard存在；CI 报Cannot find module就是这里断了 - SCSS 项目必须加
plugins: ['stylelint-scss']，否则嵌套、变量等语法直接报Unknown word
selector-class-pattern 规则不生效的典型原因
想强制 BEM 命名却一直没警告？这不是插件问题，而是规则本身默认关闭。
stylelint 的命名类规则（如 selector-class-pattern）不会随 stylelint-config-standard 自动启用，必须显式配置：
- 在配置中加入：
"selector-class-pattern": "^([a-z][a-z0-9]*)(__[a-z][a-z0-9]*)?(--[a-z][a-z0-9]*)?$" - 注意正则锚定：开头
^和结尾$必须有，否则.btn__icon--large-text这种也会通过 - 若需兼容状态类（如
.is-active），不能删规则，得用ignore: ["consecutive-dashes"]或写更宽松的正则 - 规则只作用于类选择器，
id或属性选择器不受影响
真正容易被忽略的是：WebStorm 的实时检查只响应「保存」或「失焦」，不是每敲一个字符都校验。写完类名后记得按 Ctrl+S 或切出编辑区，不然看不到提示。
