文件扩展名如何匹配VSCode图标-VSCode-PHP中文网

vscode图标不显示的主因是workbench.icontheme未生效：必须手动通过命令面板选择非none图标主题（如vscode-icons）、安装对应扩展并重载窗口、开启explorer: show icons开关，三者缺一不可。

文件扩展名如何匹配vscode图标

VSCode图标不显示，先看`workbench.iconTheme`有没有生效

装完 vscode-icons 或 material-icon-theme 后图标还是文档样式，90% 是因为主题根本没激活。VSCode 不会自动启用新装的图标扩展，必须手动触发一次 Preferences: File Icon Theme 命令，并从列表里选中它——不是点“安装”，是点“选中”。选完右下角状态栏要出现对应主题名（如 Material Icon Theme），否则后续所有自定义都白配。

检查方式：打开开发者工具（Developer: Toggle Developer Tools），Console 里搜 icon，如果报 Failed to load icon theme，说明 workbench.iconTheme 的值写错了或被覆盖了。

workbench.iconTheme 必须写在用户设置或工作区 .vscode/settings.json 里，不能靠插件自己注册
值必须和扩展 ID 完全一致："material-icon-theme" ✅，"MaterialIconTheme" ❌，"material-icon" ❌
多根工作区下，某个子文件夹的 .vscode/settings.json 若含 "workbench.iconTheme": null，该文件夹图标会强制退回到默认样式

`vsicons.associations.files` 和 `material-icon-theme.files.associations` 怎么写才匹配成功

扩展名匹配不是“模糊识别”，而是精确字符串比对。比如想让 .env.local 显示锁图标，material-icon-theme.files.associations 里必须写 ".env.local": "lock"，而不是 "env.local" 或 "*.env.local"。

常见错误：

vsicons.associations.files 的 extensions 字段只接受不含点的后缀名：["env"] ✅，[".env"] ❌
material-icon-theme.files.associations 的 key 是完整文件名或通配符：".env.local" ✅，"env.local" ❌；"*.config.ts" ✅，"*.config.*" ❌（不支持双重通配）
图标名必须是该扩展实际支持的 ID："gear"、"typescript-config"、"lock" 都行，但 "dotenv"、"tsconfig"、"tune-icon" 都不行——得查插件 README 或源码里的 iconDefinitions.json

为什么 `.tsconfig.json` 还是 JSON 图标

VSCode 默认把 .tsconfig.json 当作 json 类型处理，而图标主题只按语言类型或文件名映射，不会自动推断语义。所以即使你配了 vsicons.associations.files，如果 VSCode 没把它当成 TypeScript 配置文件解析，图标就挂不上。

VSCode

避免常见的 VSCode 错误——设置冲突、调试器配置和扩展冲突。

下载

必须两步一起做：

用 files.associations 告诉 VSCode：“这个文件用 TypeScript 语言服务”："*.tsconfig.json": "typescript"
再用 vsicons.associations.files 绑定图标：{"icon": "typescript-config", "extensions": ["tsconfig.json"], "format": "svg"}
注意：files.associations 支持通配符，vsicons.associations.files 的 extensions 只支持精确后缀名，tsconfig.json 不能写成 *.tsconfig.json

多段后缀（如 `.env.local`、`.prettierrc.cjs`）怎么匹配

VSCode 和主流图标扩展默认只认最后一段后缀（cjs、gitignore），前面的修饰部分会被忽略。这意味着 .prettierrc.cjs 会被当普通 cjs 文件，得不到 settings 类图标。

解决办法只有手动映射完整文件名：

material-icon-theme.files.associations：直接写 ".prettierrc.cjs": "settings"
vsicons.associations.files：不支持文件名匹配，只能退而求其次，把 cjs 统一映射为 settings，但会误伤其他 .cjs 文件
没有通配符捷径——"*.prettierrc.*" 不生效，"prettierrc.*" 也不行，必须逐个列明：".prettierrc"、".prettierrc.json"、".prettierrc.cjs"…