VSCode原生支持Markdown实时预览,需文件为.md/.markdown后缀且语言模式为Markdown、已保存;数学公式需开启markdown.preview.mathjax;增强功能推荐Markdown All in One插件,避免与Markdown Preview Enhanced等冲突。

VSCode 原生就支持 Markdown 实时预览,不需要插件也能用 Ctrl+Shift+V(Windows/Linux)或 Cmd+Shift+V(macOS)唤出预览窗格——但默认体验比较基础,比如不支持数学公式、目录跳转不灵敏、样式简陋、无法导出 PDF 等。
原生预览怎么开?为什么有时点不动?
VSCode 内置的 Markdown Preview 功能默认启用,但必须满足两个前提:
- 当前文件后缀是
.md或.markdown,且语言模式被识别为markdown(右下角状态栏显示“Markdown”,不是“Plain Text”) - 文件已保存(
Untitled-1未保存的临时文件不触发预览)
常见失效场景:粘贴内容后没手动切换语言模式 → 点击右下角文字,选“Markdown”;或者文件名漏写了 .md → 改名并重载窗口。
mathjax 公式渲染不出来?加个配置就行
原生预览默认关闭 LaTeX 渲染,需手动开启。在 VSCode 设置里搜 markdown.preview.mathjax,勾选它;或者直接在 settings.json 加一行:
"markdown.preview.mathjax": true
注意:这仅启用 MathJax(浏览器端渲染),不依赖本地服务;若写的是 $$E = mc^2$$ 或行内 $a + b$,保存后刷新预览即可生效。别装额外的“LaTeX 插件”来干这事——多数会冲突或白忙活。
要目录、图表、Mermaid、导出 PDF?推荐这组轻量插件
只装一个插件就能覆盖多数增强需求:Markdown All in One(作者:Yu Zhang)。它不抢原生预览逻辑,而是叠加功能:
- 快捷键
Ctrl+K Ctrl+T插入自动生成的目录(支持多级、链接跳转) - 输入
```mermaid回车,自动补全 Mermaid 代码块并渲染流程图/时序图 -
Ctrl+Shift+P→ “Markdown: Export to PDF” 直接调用系统 Chromium 导出(需已安装 Chrome/Edge) - 支持 frontmatter YAML 解析、标题折叠、快捷插入引用/链接/表格
别同时装 Markdown Preview Enhanced —— 它自己实现整套预览引擎,和 VSCode 原生机制打架,常导致预览卡死、样式错乱、热更新失效。
字体/样式难看?改 CSS 比换主题更准
想调字体大小、行高、代码块背景色?不要靠改 VSCode 主题颜色——那是编辑器 UI,不影响预览内容。正确做法是新建文件 ~/.vscode/extensions/markdown-all-in-one-*/media/markdown.css(路径因插件版本而异),或更稳妥地:在用户设置中加:
"markdown.styles": ["./markdown-preview-style.css"]
然后在工作区根目录建 markdown-preview-style.css,写:
body { font-family: "Segoe UI", sans-serif; line-height: 1.6; }
code { background: #f5f5f5; padding: 2px 4px; }
改完保存,预览窗格按 F5 刷新即可。CSS 规则只作用于预览页,不影响编辑器本身。
真正麻烦的不是装什么,而是搞清哪些功能原生已有、哪些必须插件补足、哪些插件之间互相否定。比如 Mermaid 渲染,Markdown All in One 和 VSCode 1.85+ 自带的 markdown.mermaid 设置能共存,但一旦装了 Mermaid Preview 这类独立插件,反而会让预览页弹两个重复图表。










