自定义侧边栏图标需在package.json的viewscontainers中用相对路径指定svg/png图标，路径错误、激活失败或格式不符会导致显示默认齿轮图标；svg须单色，png须24×24无透明通道。
怎么让自定义侧边栏图标真正显示出来
VSCode 默认不支持直接通过设置 JSON 给任意侧边栏视图配图标，所谓“自定义图标”本质是给 package.json 中声明的 views 或 viewsContainers 指定 icon 字段——这个路径必须是扩展包内相对路径，且仅接受 SVG（推荐）或 PNG（需 24×24 像素，无透明通道更稳）。
常见错误：把图标 URL、本地绝对路径、或 VS Code 内置图标名（如 "files"）直接填进用户设置 "workbench.iconTheme"，这完全无效——那个设置只影响文件资源管理器等内置视图的图标主题，不作用于你注册的侧边栏容器。
- SVG 图标务必使用单色（
#000或#fff），避免渐变/滤镜，VSCode 不解析这些 - 路径写成
"./icons/my-view.svg"，别漏掉./；构建时确保它被打包进extension.js同级目录 - 注册容器时，
id必须和views中引用的containerId完全一致，大小写敏感
为什么改了 icon 路径还是显示默认齿轮图标
这是扩展激活失败的典型表现。VSCode 在加载扩展时若发现 package.json 的 contributes.viewsContainers 结构非法、图标路径 404、或扩展入口 JS 报错，就会静默降级，用默认齿轮图标兜底，且不报任何明显提示。
排查顺序：
- 打开命令面板（
Ctrl+Shift+P），运行Developer: Toggle Developer Tools，切到 Console 标签页，看是否有Failed to resolve view container icon类报错 - 确认
package.json中contributes.viewsContainers.location值为"sidebar"（不是"activitybar"或拼错） - 检查
activationEvents是否包含对应视图的激活事件，例如"onView:myCustomView"，否则扩展根本不会启动去读图标配置
SVG 图标颜色无法随主题切换怎么办
VSCode 不自动适配 SVG 颜色——它只把 SVG 当静态图片渲染。想实现暗色/亮色主题下自动反色，得用 CSS 变量 + <use></use> 引用符号的方式，但 VSCode 侧边栏不支持注入自定义 CSS（官方禁用），所以实际可行方案只剩两个：
- 准备两套 SVG：一套纯黑（
#000）用于亮色主题，一套纯白（#fff）用于暗色主题，然后在扩展激活时读取vscode.workspace.getConfiguration("workbench").get("colorTheme")，动态注册对应图标的容器（需先注销再重注，较重） - 更轻量的做法：统一用灰色（如
#6c7280），这个值在绝大多数官方主题下都足够清晰，且免去逻辑判断
别试图用 <style></style> 标签写 fill: var(--vscode-icon-foreground) —— VSCode 渲染侧边栏图标时根本不执行 SVG 内联样式。
用 PNG 替代 SVG 会有什么隐患
可以，但限制明确：必须是 24×24 像素、无 Alpha 通道（即不能有半透明）、背景为纯色（推荐 #ffffff 或 #000000）。VSCode 对 PNG 的缩放和抗锯齿处理很弱，稍大或稍小都会模糊或拉伸变形。
- 导出 PNG 时，在 Sketch/Figma 中关掉“透明背景”，填满纯白画布再导出
- 用
file my-icon.png命令确认输出是 “PNG image data, 24 x 24, 8-bit/color RGB” —— 出现8-bit/color RGBA就说明带透明通道，必出问题 - Windows 用户特别注意：资源管理器预览可能欺骗你，实际加载时仍失败，务必以开发者工具 Network 面板确认图标 HTTP 状态码为 200
图标替换这事，表面是换张图，背后卡在扩展生命周期、路径解析规则、以及 VSCode 渲染引擎对 SVG/PNG 的不同宽容度上——调通那一刻，往往是因为某处多了一个点、少了一个斜杠，或者主题切换后忘了清缓存。
