svg preview 插件需手动触发预览，右键选 open preview 或用快捷键 ctrl+k v（win/linux）/cmd+k v（macos）；预览空白多因含相对路径或 url() 引用，应改用自包含 svg；复杂图形易卡顿，建议关闭多余分栏并禁用自动刷新；自动刷新可启用但需防构建工具干扰；它不执行脚本、不支持 cors 或 @import，非浏览器替代品。
SVG Preview 插件装了但点不开预览
插件本身不自动打开预览窗格，必须手动触发。常见误操作是双击 SVG 文件后只看到 XML 源码，以为“没生效”——其实只是没调出预览视图。
- 右键 SVG 文件 → 选
Open Preview（不是Open with Default Editor） - 或用快捷键：
Ctrl+K V（Windows/Linux） /Cmd+K V（macOS） - 如果快捷键无效，检查是否被其他插件占用；可在
keybindings.json中确认绑定项为svg.preview
预览显示空白或报错“Cannot load image”
多数情况是 SVG 内含相对路径引用外部资源（比如 <image href="assets/icon.png"></image>），而 VSCode 预览器默认不解析或加载这些路径，也不支持内联 CSS 中的 url() 调用。
- 确保 SVG 是自包含的：所有图形用
<path></path>、<circle></circle>等原生元素绘制，避免<image></image>或<use href="..."></use> - 删掉或注释掉
<style></style>块里带url()的声明（如background: url(./bg.svg)） - 如果必须用外部资源，改用绝对路径（如
file:///full/path/to/icon.png），但注意跨平台兼容性差，不推荐
缩放/交互体验卡顿或失真
VSCode 自带的 SVG Preview 渲染基于 WebView，对复杂图形（尤其含大量 <g></g> 嵌套、滤镜、渐变或 JS 动画）支持有限，容易卡顿甚至崩溃。
- 关闭不必要的编辑器分栏，减少 WebView 实例数量
- 在
settings.json中添加："svg.preview.autoRefresh": false，改用手动刷新（Ctrl+Shift+P→SVG: Refresh Preview） - 超过 500 行的 SVG 建议用浏览器打开验证，VSCode 预览仅适合中低复杂度图标和简单图表
想让 SVG 预览随文件保存自动更新
默认是手动触发，但可以开启自动刷新。不过要注意它会监听文件系统变化，某些构建工具（如 Webpack、Vite）热更新时可能触发多次重绘，造成短暂卡顿。
- 在设置中搜索
svg.preview.autoRefresh，勾选启用 - 若使用 Prettier 或 ESLint 自动格式化 SVG，确保格式化后仍保持语法合法（例如不把
>自闭合标签改成>） - 遇到自动刷新失败，先检查文件是否被其他进程独占（如设计软件正打开该 SVG），VSCode 无法读取时会静默失败
