vs code 默认不提示 html class 名，因原生功能不解析 css 文件；需装插件、启用 editor.suggest.showclasses 和 editor.quicksuggestions.strings，并手动配置 css.stylesheets 指定路径。
VS Code 默认不提示 HTML 中的 CSS 类名，装了插件、开了设置却没反应，大概率是没让编辑器“看见”你的 CSS 文件。
为什么 class="" 里不弹出你写的 .btn-primary
VS Code 原生 HTML 补全只认标签和属性名，class 值被当成普通字符串处理，不会去读 styles.css 或 tailwind.css。它不知道你定义了哪些类，更不会解析 @import 或 SCSS @use —— 除非你告诉它去哪找。
- 插件如
IntelliSense for CSS class names in HTML会扫描项目根目录下匹配*.css、*.scss、*.less的文件 - 但默认不递归进子目录（比如
src/css/或assets/styles/），除非显式配置路径 - 如果 CSS 类是 JS 动态拼接的（如
clsx('m-2', isOpen && 'block')），插件也无能为力
VS Code 中启用 class 名自动提示的关键三步
只装插件或只改 editor.quickSuggestions 都不够，必须闭环：
- 安装插件：
IntelliSense for CSS class names in HTML（非HTML CSS Class Suggestions等已停更版本） - 打开设置（
Ctrl+,），搜索并启用：editor.suggest.showClasses（设为 true） - 同样在设置中，展开
editor.quickSuggestions→ 把strings项设为 true（否则双引号内不触发） - 确认插件已识别到你的 CSS 文件：在
class="|"光标处按Ctrl+Space，若提示空白，说明路径未覆盖到；此时需手动指定路径
如何让插件扫描 css/ 子目录下的所有样式文件
插件默认只扫项目根目录，要支持 css/layout.css、css/utils.css 等，必须在工作区 .vscode/settings.json 里加配置：
{
"css.styleSheets": [
"css/layout.css",
"css/utils.css",
"src/styles/main.scss"
]
}
注意："*.css" 这种通配符无效；也不能用 ${workspaceFolder}/css/*.css —— 插件不支持 glob 模式。每个路径必须写死，且相对路径以工作区根为基准。
- 路径错误时，插件日志（可通过命令面板运行
Developer: Toggle Developer Tools查看 Console）会报Failed to load stylesheet - SCSS 文件会被正确解析，但要求文件本身语法合法（例如不能有未闭合的
@mixin） - 使用 Tailwind 时，还需存在有效的
tailwind.config.js，否则插件只提示你 CSS 文件里明确定义的类，不补全bg-blue-500这类工具类
常见失效场景与绕过方式
有些情况插件天生不覆盖，得换思路：
- Monorepo 多包结构下，插件默认只索引当前打开的工作区，
packages/ui/src/styles.css不会被主工作区扫描到 → 解决：把该目录单独添加为 VS Code 工作区文件夹（multi-root workspace） - 类名来自 CDN（如 Bootstrap CSS 通过
<link>引入）→ 插件无法加载远程资源 → 解决：下载对应 CSS 到本地并加入css.styleSheets - 使用 CSS Modules（
Button.module.css），类名被哈希化 → 插件能读文件但提示的是原始名（如container），不是运行时真实类名 → 这属于设计限制，无法绕过
真正容易被忽略的是：插件启动有延迟，首次打开大项目可能等 3–5 秒才开始索引 CSS；期间手动触发 Ctrl+Space 会失败，但稍等再试即可。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
