Stylelint在VSCode不报错，主因是校验链路中断：未安装本地stylelint、缺失.stylelintrc.*配置文件，或VSCode未将文件识别为小写scss；插件仅作调度，依赖项目级依赖、配置及语言模式匹配。

Stylelint 在 VSCode 里不报错，基本可以断定不是插件坏了，而是校验链路断在了某一个环节——最常见的是没装本地 stylelint、没配 .stylelintrc.*、或 VSCode 没把文件识别为 scss（注意小写）。

为什么装了插件却对 CSS/SCSS 文件完全没反应

VSCode 的 stylelint.vscode-stylelint 插件只是“调度器”，它不自带规则、不解析代码，真正干活的是项目里安装的 stylelint 包和配置文件。常见断点：

• 项目根目录没有 .stylelintrc.js、.stylelintrc.json 或 stylelint.config.js —— 没配置文件时，Stylelint 直接静默退出，连警告都不抛
• package.json 里没装 stylelint（只装了 VSCode 插件不算）：运行 npm install --save-dev stylelint stylelint-config-standard
• VSCode 设置里 stylelint.enable 是 false（默认值），必须手动设为 true

如何让 SCSS/LESS 文件也被检查

VSCode 默认只对 .css 后缀触发 Stylelint，.scss 和 .less 需显式声明并确保语言模式匹配：

• 在工作区 .vscode/settings.json 中添加："stylelint.validate": ["css", "scss", "less"]
• 右下角点击当前语言模式（如显示 “Plain Text” 或“SCSS (syntax)”），手动选成小写的 scss 或 less —— 写成 SCSS 或 Less 会失效
• 如果用的是 .module.scss 这类后缀，需在 .stylelintrc.js 里加 overrides 并指定 customSyntax: "postcss-scss"

保存时自动修复为什么只修一半

--fix 不是万能的，Stylelint 官方明确标注每条规则是否支持自动修复（✅/❌）。常见误区：

PigX UI 前端开发

PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。

下载

• "color-hex-case": "lower"、"declaration-block-trailing-semicolon": true 这类格式类规则可修；但 "selector-max-id": 0、"no-duplicate-selectors" 这类语义/结构类规则不可修
• VSCode 1.84+ 已弃用 stylelint.autoFixOnSave，改用："editor.codeActionsOnSave": { "source.fixAll.stylelint": true }
• 如果修复后样式乱掉，大概率是和 Prettier 冲突——关掉 Prettier 的 formatOnSave，只让 Stylelint 管规范，Prettier 管缩进/换行/引号

Vue/Svelte 单文件组件里的 <style> 块不检查怎么办

Stylelint 默认跳过 <style> 标签内容，除非你告诉它“这里面是 CSS”：

立即学习“前端免费学习笔记（深入）”；

• 安装 stylelint-processor-html（Vue）或 stylelint-processor-svelte（Svelte）
• 在 .stylelintrc.js 里写 "processor": "stylelint-processor-html"（Vue）或对应 Svelte 处理器
• 确保 stylelint.validate 包含 "vue" 或 "svelte"，否则即使装了处理器也触发不了

真正容易被忽略的是：**配置文件存在 ≠ 规则生效**。比如 .stylelintrc.json 里写了 "rules": {"color-hex-case": "upper"}，但若项目同时 extends 了 stylelint-config-standard，而它内部已定义该规则为 "lower"，那你的设置会被覆盖——得确认继承链和优先级。