必须安装ExportHtml插件才能导出带语法高亮的HTML文件,它支持Sublime Text 4、正确映射主题色与作用域,而老旧插件在ST4下易崩溃、漏样式或显示异常。

Sublime Text 本身不提供「导出 HTML」功能,所谓“导出带高亮的网页”,本质是把当前编辑器里渲染出的颜色(syntax highlighting)转成内联 CSS 写进一个 index.html 文件——这事必须靠插件做,没捷径。
必须装 ExportHtml 插件,别信其他老插件
目前唯一稳定支持 Sublime Text 4、持续更新、能正确映射主题色和作用域的插件是 ExportHtml。老旧插件如 sublimetext-html-export 或 SublimeHighlight 在 ST4 下常崩溃、漏样式、不识别新语法(比如 TypeScript 的 const 作用域),或生成的 HTML 在 Chrome/Firefox 中显示异常。
- 按
Ctrl+Shift+P(Win/Linux)或Cmd+Shift+P(macOS),输入Package Control: Install Package回车 - 再输入
ExportHtml,回车安装;部分版本需重启 Sublime 才生效 - 装完右键编辑区就会出现
Export Html菜单项,不用记快捷键
导出前必须手动设对语法和编码
插件不会猜你写的是什么语言。如果右下角状态栏显示的是 Plain text,哪怕文件后缀是 .py,导出结果就是纯黑字——因为没语法定义,就无高亮可映射。
- 先确认语法:点击右下角状态栏的
Plain text→ 选对应语言,如Python、JavaScript、Markdown - 中文乱码?检查文件编码:菜单
File → Save with Encoding → UTF-8;插件不转换编码,只照搬当前文件内容 - Markdown 需额外注意:必须先设语法为
Markdown,否则MarkdownPreview类插件也不会触发,更别说导出
默认快捷键 Ctrl+Alt+X 导出的 HTML 容易翻车
直接按快捷键会走默认配置,但几个关键参数不调好,生成的 HTML 在浏览器里打开就是错位、背景过暗、长行折断、甚至 <div> 标签被当成代码显示出来。
使用 PptxGenJS 和 Python 解析,将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint(.pptx)演示文稿。
立即学习“前端免费学习笔记(深入)”;
-
include_line_numbers:勾选后加行号,但 PDF 打印时容易挤压代码区域,建议关掉 -
wrap_lines:默认关闭;若开启,HTML 里会强制折行,但折点不可控(比如把fetch(url).then(...)拆成两行),语义断裂 -
full_page:必须开启,否则只输出<pre><code>块,没<html>结构和内联样式,粘贴到 Word 或打印就是纯文本 -
color_scheme:不要手填路径;在弹出面板里从下拉列表选,如Monokai.sublime-color-scheme,填错路径会导致高亮全灰 - 代码含 HTML 特殊字符?插件默认不转义:
<div class="x">会被当标签解析——得手动在导出前用正则替换为<div>,或改用 <code>Copy as HTML插件(只输出片段,不包<html>)导出后必须立刻验证三件事
生成的
index.html不是“点开就完事”。不同环境对内联样式、字体、宽高处理差异极大,尤其发给客户或交作业前,务必人工核对:- 双击用 Chrome 打开,看是否所有关键词都着色、背景是否可读(深色主题在某些显示器上可能发灰)
- 拖动窗口缩放,检查长代码行是否溢出容器、是否出现横向滚动条(
wrap_lines关了但容器 CSS 没设overflow-x: auto就会丢内容) - 复制整段 HTML 粘贴进 Notion / 邮件 / GitHub README,看高亮是否还在——这些平台通常剥离内联
style,只剩纯文本
最常被忽略的一点:导出动作依赖当前视图状态。如果你没保存文件(还是
untitled),插件会报No file name;如果你折叠了某段代码,ExportHtml: Export Current View可能只导出展开部分——要导全,先按Ctrl+K Ctrl+J展开全部。


















