Sublime 中批量 Base64 图片须先用正则提取纯 Base64 字符串（如 data:image/[^;]+;base64,([A-Za-z0-9+/=]+) → $1），再用 SublimeStringEncode 插件解码或编码，严禁全选含 data URL 前缀的整行操作；图片二进制无法被 Sublime 直接识别，控制台硬编码会因字符串/字节类型混淆及 Unicode 解码失败而报错，必须依赖外部命令（如 base64 -i img.png | tr -d '\n'）生成原始 Base64，再粘贴处理，并手动补 data:image/png;base64, 前缀，同时注意 MIME 类型匹配与大文本分片防卡顿。
Sublime 里批量 Base64 图片？别直接选文件，先切出 data URI
Sublime Text 本身不识别图片二进制内容，FileReader 或 canvas 那套浏览器逻辑在编辑器里根本跑不了。你拖一张 PNG 进 Sublime，看到的只是乱码字节流——插件没法自动“猜”这是图片还是日志。所以第一步必须人工剥离 base64 前缀，只留下纯 Base64 字符串再操作。
常见错误是：直接全选 HTML 中的 <img src="data:image/png;base64,iVBORw..."> 整行执行 StringEncode: Base64 Encode，结果把 data:image/png;base64, 也编码了一遍，解码后完全失效。
- 用正则
Ctrl+H→ Find:data:image/[^;]+;base64,([A-Za-z0-9+/=]+)→ Replace:$1→Find All，多光标自动定位所有 Base64 片段 - 确认光标只落在 Base64 字符串上（不含逗号、空格、换行），再执行
StringEncode: Base64 Decode还原原始二进制内容（此时仍是乱码，但已可验证是否有效） - 若需重新编码新图片，得先在系统里用命令行生成：
base64 -i logo.png | tr -d '\n'，再把结果粘贴回 Sublime 操作
为什么不能用 Sublime 控制台硬写 base64.b64encode() 处理图片数据
控制台只接受文本输入，base64.b64encode() 要求传入 bytes，而 Sublime 的 view.substr(region) 返回的是 str。你复制一段乱码二进制到控制台，Python 会按 UTF-8 解码失败，直接报 UnicodeDecodeError；强行加 b'' 前缀又因换行符、BOM、非 ASCII 字节导致 bytes 构造失败。
真实场景中，一张 200KB 的 PNG 经 Base64 编码后约 270KB，字符串长度轻松超 10 万字符——控制台粘贴、执行、输出都卡顿，且无法绑定到选区，纯属临时调试陷阱。
立即学习“前端免费学习笔记（深入）”；
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
- 控制台适合验证单行短文本，比如
base64.b64encode(b"hello").decode("utf-8") - 处理图片相关 Base64，必须走外部工具链：终端
base64命令 + Sublime 粘贴 + 插件二次加工 - Windows 用户注意：
certutil -encodehex输出带空格和换行，得额外用tr -d ' \r\n'清洗，不如 WSL 或 macOS 原生命令可靠
前端内联资源场景下，Base64 编码后要手动补 data URL 前缀
SublimeStringEncode 只做纯 Base64 编解码，不会自动拼 data:image/png;base64,。你在 CSS 里写 background: url("iVBOR..."); 是无效的，浏览器认不出这是图片。
容易被忽略的是 MIME type 必须匹配原始文件。用 file logo.png 查看实际类型，PNG 可能是 image/png，但某些导出工具生成的是 image/x-png 或带 profile 的 image/png; charset=utf-8，后者会导致 Safari 拒绝渲染。
- 编码前先确认文件类型：
file -b --mime-type logo.png - 替换时用正则批量补前缀：
Ctrl+H→ Find:^([A-Za-z0-9+/=]{10,})$→ Replace:data:image/png;base64,$1（确保只匹配长 Base64 行） - HTML 中的
<img>标签建议保留完整 data URL，CSS 中的url()函数值两端加引号，避免空格截断
大图 Base64 后体积膨胀，Sublime 编辑时卡顿怎么破
一张 1MB 的图片 Base64 后约 1.33MB，Sublime 渲染超长单行文本（无换行）会严重拖慢响应。实测 >500KB 的 Base64 字符串会让 Ctrl+F 搜索延迟明显，撤销栈也极易崩溃。
这不是插件问题，是 Sublime 自身对长行文本的渲染机制限制。强行操作可能丢数据，尤其没开自动保存时。
- 处理前先切片：用
split -b 200k image.b64拆成小块，每块单独编码/校验 - 在 Sublime 里用
Ctrl+Shift+P→Convert Line Endings to Unix统一换行，避免 Windows CRLF 加剧体积 - 最终插入代码前，用在线工具（如 base64.guru）校验字符串有效性——Sublime 不报错不代表能被浏览器 decode
