Sublime Text 打开 SVG 文件仅显示 XML 源码，无法内置预览；需通过系统默认浏览器打开或配置快捷构建命令（如 OpenInBrowser）实现快速预览，编辑时须注意 width/height/viewBox、path 的 d 属性格式及避免 XML 格式化破坏结构。
Sublime 里打开 SVG 文件只是文本，不是图形预览
Sublime Text 本质是纯文本编辑器，svg 文件在它里面默认显示为 XML 源码——你看到的是标签、属性和路径数据，不是可缩放的图形。想“预览”，得靠外部工具或浏览器联动，不能指望 Sublime 自带渲染。
- 直接双击打开
.svg文件，系统可能用默认浏览器打开（这是最简单有效的预览方式） - 别尝试装“SVG 预览插件”：Sublime 的插件生态里没有真正能在编辑器内渲染 SVG 的可靠方案，所谓“预览”基本是调用系统默认浏览器新开窗口
- 如果右键菜单里没有“在浏览器中打开”，说明文件关联没设好，不是 Sublime 的问题，而是系统级配置缺失
用快捷键快速在浏览器中预览当前 SVG 文件
手动找浏览器太慢，推荐配置一个快捷命令，按一下就自动用默认浏览器打开当前 .svg 文件。
- 在 Sublime 中按
Ctrl+Shift+P（Windows/Linux）或Cmd+Shift+P（macOS），输入Build System: New Build System… - 粘贴以下内容并保存为
OpenInBrowser.sublime-build：
{
"shell_cmd": "start \"\" \"$file\"",
"selector": "source.svg",
"windows": {
"shell_cmd": "cmd /c start \"\" \"$file\""
},
"osx": {
"shell_cmd": "open \"$file\""
},
"linux": {
"shell_cmd": "xdg-open \"$file\""
}
}
- 保存后，用
Ctrl+Shift+B调出构建菜单，选OpenInBrowser即可刷新预览 - 注意：
$file是 Sublime 的内置变量，必须用双引号包裹，否则含空格路径会失败 - Mac 上如果报错
Unable to find binary，说明open命令被禁用或环境异常，优先改用 Safari 直接拖入预览
编辑 SVG 时容易误删的关键结构
SVG 是 XML，但不是所有 XML 规则都宽松。Sublime 不校验语法，删错一个属性或闭合标签，浏览器一刷新就白屏或报错。
-
<svg>标签必须有width和height，或至少一个viewBox，否则多数浏览器不渲染 -
<path d="...">里的d属性值不能换行或加空格（除非是合法分隔符如空格、逗号、字母），Sublime 的自动换行会悄悄破坏路径数据 - 别用 Sublime 的“格式化 XML”插件（如
XML Tools）一键美化 SVG——它可能把<circle cx="10"/>拆成两行，导致某些旧版 IE 解析失败 - 颜色值写
#fff没问题，但写white要小心：部分 SVG 渲染引擎不支持全部 CSS 颜色关键字
需要实时编辑+预览，别硬扛 Sublime
如果你在调图标、做动画、反复改 <g transform> 或 <animate>，Sublime 的“保存→切窗口→刷新”流程会迅速消磨耐心。
- 本地开发建议用 VS Code +
SVG Preview插件：保存即内嵌预览，支持缩放、导出 PNG，且不干扰源码编辑 - 在线调试用 https://www.php.cn/link/33ee8208ed93950a7f22cd7898f7735e：直接粘贴代码，改一行立刻看到效果，适合验证复杂变换或滤镜
- Sublime 真正适合的场景是：批量查找替换
fill="#000"、正则提取所有<use xlink:href="#icon-.*?">、或配合svgo命令行压缩后检查输出
SVG 的编辑和预览从来不是单点工具能闭环的事，Sublime 做好它最擅长的部分就行——快、轻、稳地处理文本。其他事，交给更专的工具。
