类名补全不触发需检查editor.suggest.showclasses是否为true，确认文件后缀与语言模式正确，html中需开启html.suggest.html5，且css/scss文件须本地存在并被vs code识别。
类名补全不触发？检查 editor.suggest.showClasses 设置
VS Code 默认会为 CSS/SCSS/Less 文件提供类名补全，但前提是对应语言模式已激活，且补全功能未被手动关闭。常见现象是输入 . 后毫无反应，或只提示 HTML 标签名、不提示项目中已定义的类。
- 打开设置（
Ctrl+,或Cmd+,），搜索showClasses，确认editor.suggest.showClasses为true - 确保当前文件后缀正确（如
index.html、style.css、component.scss），且右下角语言模式显示为对应类型，不是Plain Text - 若用 Tailwind CSS，需额外安装官方插件并启用
tailwindCSS.experimental.classRegex等配置，否则无法识别自定义 class 字符串拼接
HTML 中写 class="xxx" 时没补全？看是否启用了 html.suggest.html5
VS Code 的 HTML 补全是分层的：基础标签和属性靠内置支持，而类名来源依赖外部扫描。如果只输 class=" 就没提示，大概率是 HTML 模式下的类名索引未生效。
- 检查设置中
html.suggest.html5必须为true（它控制是否启用 HTML5 属性建议，也影响 class 补全链路） - 类名补全实际依赖工作区中已打开的 CSS/SCSS 文件，或
link引入的外部样式表——但 VS Code 不解析远程 URL 或构建后产物，只读取本地.css、.scss、.module.css等可访问文件 - 若用 CSS Modules，类名带哈希（如
button__primary_abc123），默认不提示；需配合插件如CSS Modules Extensions并配置"cssModules.enabled": true
React/Vue 里 className 或 不补全？语言服务没接管 JSX/Template</H3>
<p>JSX 中的 <code>className
是 JavaScript 属性，Vue 模板中的 :class 是指令绑定，它们不走 HTML 补全路径，而是依赖语言服务器（如 TypeScript Server、Volar）主动提取样式定义。
- React 项目需有
tsconfig.json 或 jsconfig.json，且包含 "include": ["**/*.tsx", "**/*.ts"]，否则 TS 语言服务无法索引组件内引用的样式文件
- Vue 项目必须启用 Volar（非 Vetur），并在
settings.json 中设 "volar.autoInsertAttributeColon": true，同时确保 .vue 文件顶部 <style></style> 块被正确识别（比如没写错 lang="scss" 却引入了 postcss 插件）
- 使用
import styles from './Button.module.css' 时，类名补全依赖 TypeScript 的模块解析能力；若报 Cannot find module，补全直接失效
补全出来了但不准？可能是 CSS 文件未被“发现”或作用域隔离
tsconfig.json 或 jsconfig.json，且包含 "include": ["**/*.tsx", "**/*.ts"]，否则 TS 语言服务无法索引组件内引用的样式文件settings.json 中设 "volar.autoInsertAttributeColon": true，同时确保 .vue 文件顶部 <style></style> 块被正确识别（比如没写错 lang="scss" 却引入了 postcss 插件）import styles from './Button.module.css' 时，类名补全依赖 TypeScript 的模块解析能力；若报 Cannot find module，补全直接失效VS Code 不会全局扫描整个磁盘找 CSS，它只基于当前打开文件的导入关系、同目录样式文件、以及 html.link 中的相对路径做轻量索引。很多“有类却不出现在提示里”的情况，根源在此。
- 检查 HTML 中是否用
<link rel="stylesheet" href="./styles.css">—— 路径必须是相对路径且文件真实存在；href="/static/styles.css"这种绝对路径不会被解析 - 若 CSS 在
node_modules（如 Bootstrap），默认不索引；需手动在settings.json加"css.validate": false并配合插件如Auto Import或IntelliSense for CSS class names - Webpack/Vite 构建中动态生成的类（如
clsx(button, { 'is-active': active })），补全无法静态推导，属于工具链限制，不是配置问题
