怎么在VSCode中使用CSS Modules_VSCode CSS模块类名补全与跳转-VSCode-PHP中文网

根本原因是typescript缺少css modules类型声明且vscode语言模式未设为“css modules”，导致styles被推断为record而非具体类名对象；需添加declare module '*.module.css'声明并手动切换文件语言模式。

怎么在vscode中使用css modules_vscode css模块类名补全与跳转

CSS Modules 类名没提示、点不了跳转，不是插件没装，而是类型信息或语言服务没对上——这两点卡住，补全和跳转就全失效。

为什么 `import styles from './Button.module.css'` 里 `styles` 没类名提示？

VSCode 默认把 .module.css 当普通 CSS 文件处理，styles 被推断为 Record<string string></string>，根本不知道它实际导出了 button、disabled 这些键。本质是 TypeScript 缺少模块声明，不是“提示功能坏了”。

必须在项目中提供类型定义：在 src/@types/css-modules.d.ts（或任意 .d.ts 文件）里写 declare module '*.module.css' { const classes: Record<string string>; export default classes; }</string>
如果用了 camelCase 命名（如 .btn-primary → btnPrimary），声明要改成 const classes: { [key in keyof typeof import('./Button.module.css')]: string }; 或直接用 @types/css-modules 包
确保 tsconfig.json 的 typeRoots 或 include 覆盖了声明文件路径，否则 TS 不会加载它

装了 CSS Modules 插件但跳转不到类名定义？检查语言模式和配置

插件（如 clinyong.vscode-css-modules）依赖 VSCode 正确识别文件语言模式和启用对应服务。即使插件已安装，右下角显示 “CSS” 而非 “CSS Modules”，跳转也不会触发。

Galileo TypeScript sdk

完整的Galileo AI平台 TypeScript/JS SDK 参考，用于评估、观察和保护 GenAI 应用。适用于构建 Node.js 或 TypeScript 项目。

下载

打开任意 .module.css 文件，点击右下角语言标识，手动选 “CSS Modules” —— 这步不能省，VSCode 不会自动切换
在工作区 .vscode/settings.json 中加配置："css.modules": true（旧版需显式开启，新版部分自动但建议保留）
禁用内置 CSS 校验干扰："css.validate": false，避免 .module.css 被当成非法 CSS 报错，压制语言服务启动
确认项目有 jsconfig.json 或 tsconfig.json，否则插件生成的临时类型（如 __generated__.d.ts）不会被加载

`composes` 和 `:global` 类名为什么永远不提示？

composes 是运行时合并行为，:global 是脱离模块作用域的全局注入——它们都不出现在 styles 对象的静态键里，任何静态分析工具（包括插件和类型声明）都无法可靠推导。

composes 提示只能靠“拆分+显式导入”：把被复用的类（如 reset）单独写成 reset.module.css，再 import reset from './reset.module.css'，这样 reset 才能被提示
:global(.btn) 定义的样式，不会变成 styles.btn，所以补全列表里必然没有；想让它可提示，得改用 data-btn 属性配合 CSS 选择器，或换用 styled-components
别指望插件扫描整个项目去“猜” composes 链路——2026 年目前无稳定实现，强行做会导致大型项目索引卡顿数分钟