sublime text 需依赖 markdownpreview 插件生成带锚点的 html toc 实现标题跳转,markdownediting 仅优化编辑体验;无原生侧边栏目录,但可通过预览浏览器临时查看,配置 css 可提升 toc 实用性。

Sublime Text 本身不提供 Markdown 原生目录树(TOC)侧边栏,也没有内置的“点击标题跳转”导航面板。所谓“快速查看目录”,实际依赖插件生成并渲染大纲,再配合快捷键或面板联动实现——不是开箱即用,但配置一次就能长期高效使用。
装对插件:Markdown TOC 生成靠 MarkdownPreview + MarkdownEditing
仅靠语法高亮插件(如 MarkdownEditing)无法生成目录;真正能解析标题层级、输出 HTML TOC 的是 MarkdownPreview。它在预览时自动提取 # ~ ###### 标题,并生成带锚点的导航结构。
-
MarkdownEditing负责编辑体验:右下角切换语法、快捷键插入标题(Ctrl+1~Ctrl+6)、代码块高亮等 -
MarkdownPreview负责解析与输出:运行Markdown Preview: Preview in Browser后,浏览器里渲染的 HTML 页面顶部会显示自动生成的 TOC(默认开启,无需额外配置) - 两者需共存——如果只装
MarkdownEditing,右键菜单里压根不会出现Markdown Preview相关选项
让 TOC 可点击跳转:关键在 HTML 锚点和浏览器支持
生成的 TOC 是否可点击、能否平滑跳转到对应标题,取决于两件事:
-
MarkdownPreview输出的 HTML 必须为每个标题生成id属性(如<h2 id="installation">Installation</h2>),默认行为已开启 - 浏览器需支持原生锚点跳转(现代 Chrome/Firefox/Edge 都支持),无需额外插件
- ⚠️ 常见坑:若 Markdown 中标题含中文、空格或特殊符号(如
# 数据处理流程 & 注意事项),MarkdownPreview默认会将其转义为合法id(如data-chuli-liu-cheng-amp-zhu-yi-shi-xiang),但手动写的链接若没同步转义,就会跳转失败
想在 Sublime 内部看目录?用命令面板临时调出大纲
没有侧边栏插件能实时同步显示 Markdown 目录,但你可以用快捷方式「临时唤出」结构概览:
- 打开
.md文件后,按Ctrl+Shift+P(Windows/Linux)或Cmd+Shift+P(macOS) - 输入
Markdown Preview: Preview in Browser并回车 → 浏览器打开,TOC 自动显示在页面顶部 - 或者输入
Markdown Preview: Export HTML,生成本地 HTML 文件,双击即可离线查看带 TOC 的完整文档 - ⚠️ 别试图找“侧边栏 TOC 插件”:社区无稳定维护的 Sublime 插件能在编辑器内实时渲染并同步滚动的 Markdown 目录面板;强行安装老旧插件(如
Table of Contents)大概率在 ST4 下报错或失效
进阶:用自定义 CSS 让 TOC 更实用
默认 TOC 是静态 HTML 片段,样式简陋、不折叠、占屏大。你可以在 MarkdownPreview 设置中注入自定义 CSS 来优化:
- 进入
Preferences → Package Settings → Markdown Preview → Settings – User - 添加如下配置(示例):
"markdown_extensions": { "toc": { "permalink": true, "slugify": true } }, "css": [ " Packages/User/markdown_toc.css" ] - 然后在
Packages/User/下新建markdown_toc.css,写入浮动定位、字体缩放、折叠逻辑等——但注意:Sublime 不执行 JS,所以纯 CSS 折叠需依赖:target或details/summary,兼容性有限
MarkdownPreview 生成的 TOC 是目前 Sublime 下最可靠、兼容性最好、无需外部服务的目录方案。别被“侧边栏”误导——它的价值不在位置,而在准确性和一致性:每次保存,TOC 随 HTML 重生成,永远和源文件标题严格对应。真正容易被忽略的是路径和编码问题:如果 .md 文件放在中文路径下,部分系统可能触发 UnicodeEncodeError 导致预览失败,建议项目根目录用英文命名。










