VS Code 文件图标主题可提升目录可读性，安装后需手动启用：通过命令面板选择“Preferences: File Icon Theme”，再按需自定义文件图标映射并搭配文件夹主题使用。

VS Code 的文件图标主题能显著提升项目目录的可读性——不同文件类型用不同图标，一眼识别配置、源码、资源或脚本，不用点开看后缀。

怎么安装图标主题？

打开 VS Code，点击左侧活动栏的扩展图标（或按 Ctrl+Shift+X），搜索关键词 “file icon theme”，推荐安装 vscode-icons 或 Material Icon Theme。安装后重启窗口（或按 Ctrl+Shift+P 输入 “Developer: Reload Window”）即可生效。

启用图标主题的正确方式

安装只是第一步，必须手动启用才能显示图标：

• 按 Ctrl+Shift+P 打开命令面板
• 输入 “Preferences: File Icon Theme”
• 回车后选择已安装的主题（如 “Material Icon Theme”）

如果没看到图标，请确认没有禁用图标（设置中检查 “Workbench > Appearance > Show Activity Bar” 和 “File Explorer > Compact Folders” 不影响图标显示）。

Expanso yaml-to-json

使用 Expanso Edge 管道将 YAML 输入转换为 JSON 格式。

下载

自定义图标映射（进阶但实用）

某些项目有自定义文件（如 .env.local、next.config.js），默认可能没专属图标。可通过工作区设置手动关联：

• 在项目根目录创建 .vscode/settings.json
• 添加如下配置，为特定文件名指定图标：

{ "material-icon-theme.files.associations": { ".env.local": "config", "next.config.js": "javascript" } }

支持的图标类型包括 config、javascript、typescript、json 等，具体可查所选主题文档。

小技巧：图标 + 文件夹主题更配

图标主题常和文件夹主题搭配使用效果更佳。比如 Material Icon Theme 推荐搭配 Material Theme 的文件夹样式；vscode-icons 自带文件夹颜色方案。在扩展市场搜 “folder theme” 可一键增强视觉层次。

基本上就这些——装一个、启一个、微调一两个关键文件，整个侧边栏立刻变清晰。不复杂但容易忽略。