vscode-icons通过文件扩展名和语言标识自动匹配图标实现精准识别；需安装后手动启用图标主题，若图标未变则检查是否在设置中选中“VSCode Icons”而非默认选项。
vscode-icons 怎么让 HTML/CSS/JS 文件图标一眼可辨
它不靠猜，靠文件扩展名和语言标识自动匹配图标。安装后默认启用，但如果你发现图标没变，大概率是没选对图标主题。
检查方式很简单：Ctrl+, 打开设置 → 搜索 Icons Theme → 下拉菜单里选 VSCode Icons（不是默认的 Minimal 或空选项）。
常见问题：
- 装了插件但图标还是方块：没在设置里激活主题，重启 VSCode 也不行，必须手动选一次
- Vue/React 单文件组件显示为普通 JS 图标：确认文件后缀是
.vue或.jsx，且 VSCode 已识别语言模式（右下角状态栏应显示 “Vue” 或 “JavaScript React”） - 自定义图标失效：不要直接改插件目录里的 JSON，用
workbench.iconTheme配置项 + 自定义vsicons.customIconFolder更稳妥
Live Server 启动后改 HTML 不刷新？先查这三件事
不是插件坏了，而是它只监听当前工作区根目录下的变更，默认不递归监听子目录，也不管你用的是相对路径还是 file:// 协议打开。
实操建议：
- 确保你在项目根目录下右键点击 HTML 文件 → “Open with Live Server”，而不是双击打开或拖进浏览器
- 检查 VSCode 右下角状态栏是否显示
Live Server: http://127.0.0.1:5500，没显示说明没真正启动 - 如果用了构建工具（如 Vite、Webpack），别依赖 Live Server——它不处理
import或模块热更新，此时该用对应框架的 dev server
一个小技巧：liveServer.settings.CustomBrowser 设为 "chrome" 可指定默认打开的浏览器，避免弹出 Edge 或 Safari。
多文件夹工作区里怎么统一管理静态资源路径
当你把 frontend 和 assets 放在不同文件夹里，又想让 HTML 中的 <img src="logo.png"> 正确解析，VSCode 本身不解决路径语义，但能帮你避免硬编码错误。
关键不是插件，是配置逻辑：
- 用
.code-workspace文件显式声明文件夹路径，确保assets夹被纳入工作区（否则跳转、引用提示全失效） - 在
settings.json里加"files.associations": { "*.png": "image" }，让图片路径支持悬停预览和 Ctrl+Click 跳转 - HTML 中尽量用相对路径（
./images/logo.png），而非绝对路径（/images/logo.png），后者依赖服务器路由，VSCode 无法校验
注意：vscode-icons 不影响路径解析，它只负责“看起来像什么”，别指望它帮你修复 404。
插件装太多反而拖慢网页资源加载？这些要关掉
不是所有插件都适合前端静态资源场景。比如 ESLint 在纯 HTML/CSS 项目里基本闲置，Prettier 对 HTML 格式化效果有限，还抢走保存时的控制权。
建议按需启用：
- 禁用非必要语言服务：在插件面板里搜索
eslint→ 点击齿轮图标 → “Disable (Workspace)” - 关闭自动格式化对 HTML 的干扰：
"html.format.enable": false，留着prettier处理 JS/TS 就够了 - 慎用“实时预览类”插件（如
Markdown Preview Enhanced），它们常占用额外 WebView 进程，和 Live Server 冲突
真正影响效率的，往往不是插件数量，而是插件之间对同一事件（比如 onSave）的重复响应——一个保存触发三次格式化，延迟就来了。
