webstorm 不支持 svg 缩略图预览，因其缩略图机制基于 java awt，仅支持 png/jpg/gif 等光栅格式，而 svg 是 xml 矢量格式，官方明确“有意不支持”（jb-56218）；可靠预览方式是右键 open in browser 或配置快捷键调用内置服务器实时查看。
WebStorm 为什么点不开 SVG 缩略图
不是你配置错了，是 WebStorm 根本不支持 SVG 缩略图——它用 Java AWT 加载图像，只认 PNG/JPG/GIF 这类光栅图，而 SVG 是 XML 文本+矢量指令，IDE 不解析也不渲染。官方 issue（JB-56218）明确标注为「intentionally not supported」，不是 bug，没法靠勾选选项或装插件修复。
右键 Open in Browser 是最稳的预览方式
放弃缩略图幻想，直接用 WebStorm 原生支持的路径：
- 右键
.svg文件 → 选择Open in Browser（或按Alt+F2弹出浏览器图标栏） - 确保内置服务器已启用：进入
Settings → Tools → Web Browsers and Preview，勾选Enable built-in server（默认端口63342）；这样打开的是http://localhost:63342/xxx.svg，而非file://协议，能正常加载内联样式、<use></use>引用和 JS 交互 - 给该操作绑定快捷键：进入
Settings → Keymap，搜索Open in Browser，右键 →Add Keyboard Shortcut（比如设为Ctrl+Shift+V），比反复右键快得多
别信“SVG Viewer”插件能显示缩略图
这类插件（如 SVG Viewer）确实能提供语法高亮、右键菜单、甚至内嵌渲染面板，但它无法注入到 Project 工具窗口或编辑器 Tab 的缩略图区域。你看到的「预览」是独立面板，不是 WebStorm 原生缩略图机制的一部分。Project 树里仍只显示通用文档图标（?），和系统文件管理器是否注册 SVG 关联程序有关，和 WebStorm 无关。
大 SVG 或含外部引用时容易白屏或黑块
常见于流程图、图标集等复杂 SVG：
- 如果浏览器打开后一片黑/空白，先检查控制台是否有
CORS报错或Failed to load resource——说明用了<image href="..."></image>或<use href="..."></use>但路径不对，file://协议下跨域失败；换成内置服务器（http://localhost:63342/）就能解决 - 某些 SVG 使用了非标准命名空间或滤镜（如
filter:url(#shadow)），Chrome 渲染异常；可临时用 https://www.php.cn/link/e34be3aba22acfd0538e4b0fd963ed0d 在线验证是否为 SVG 自身问题 - 超大 SVG（>10MB 或含数万 path）可能触发浏览器内存限制，建议用
svgo压缩后再预览
