webstorm 中 stylelint 默认不工作，需手动配置包路径、扩展名、配置文件及文件类型标记。包路径须指向 node_modules/stylelint 目录而非 .bin；run for files 需添加 .scss、.vue 等扩展名；配置文件需正确指定且导出格式合法；文件必须右键标记为 stylesheet，且配置后需重启 ide。
WebStorm 里 Stylelint 默认不工作，不是插件没装，而是它根本没被激活——必须手动指定包路径、扩展名、配置文件和文件类型标记，缺一不可。
Stylelint package 路径填错：必须指向 node_modules/stylelint 目录
WebStorm 不认 node_modules/.bin/stylelint，哪怕你在终端能直接运行 npx stylelint。它要的是模块入口目录，不是可执行脚本。
- 进 Settings → Languages & Frameworks → Stylesheets → Code Quality Tools → Stylelint
- 点
Stylelint package右侧文件夹图标，手动导航到项目下的node_modules/stylelint - Windows 用户注意路径不能含空格或中文；pnpm 用户需展开
node_modules/.pnpm/找真实包路径 - 如果显示
Package not found，先在终端执行npx stylelint --version，报错说明node_modules没装全，或 Settings → Node.js 指向的 Node 版本不对
Run for files 没加扩展名：SCSS/Vue 文件默认不检查
WebStorm 默认只匹配 **/*.css，哪怕你项目全是 SCSS，不改这里就完全静音。
- 在同一个设置页中，找到
Run for files输入框 - 填入：
**/*.css;**/*.scss;**/*.sass;**/*.less;**/*.vue（分号分隔，不是逗号） - Vue 文件还需确认：
stylelint.config.js中启用了customSyntax: 'postcss-html'或'stylelint-processor-styled-components'，且已安装对应包 - 改完必须重启 WebStorm —— 配置不会热重载
Configuration file 路径不对或配置无效
WebStorm 不完全依赖自动查找，尤其当项目有多个配置文件时容易误读根目录外的配置。
-
Configuration file字段手动填：$ProjectFileDir$/stylelint.config.js（或.stylelintrc.json等合法名称） - 确认该文件用
module.exports = { }导出，不是export default（ESM 项目慎用.mjs） - 如果用了
extends: ["stylelint-config-standard"]，检查node_modules/stylelint-config-standard是否存在；CI 报Cannot find module就是这里断了 - 推荐用
.stylelintrc.js而非 JSON：支持注释、环境判断、动态导入，避免规则静默失效
文件未标记为 StyleSheet：右键标记这步不能跳过
即使所有配置都对，也要右键当前样式文件 → Mark as → StyleSheet（不是 Plain Text），否则 WebStorm 直接跳过 linting 流程。
- 这个标记状态不会继承，每个新创建的
.scss或.vue文件都得手动确认一次 - 若文件被标记为
Plain Text，右下角不会出现 Stylelint 提示，Alt+Enter也无修复建议 - 标记后，编辑器才真正开始监听变更并高亮问题
最常被忽略的是文件类型标记和重启 IDE 这两步——配置全对但没标记、没重启，等于白配。WebStorm 的 Stylelint 不是“开箱即用”，而是“按需唤醒”。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
