VSCode内置Markdown实时预览无需插件,按Ctrl+K V(Win/Linux)或Cmd+K V(macOS)触发;默认不渲染数学公式和Mermaid,需在设置中启用markdown.preview.math和markdown.preview.mermaid;样式可切换内置主题或安装官方扩展复刻GitHub风格。

VSCode 本身不内置 Markdown 实时预览功能,但通过启用内置的 Markdown Preview 功能或安装轻量扩展即可实现——无需额外装插件也能用,但默认快捷键和行为容易被忽略。
如何触发 Markdown 实时预览(不用装插件)
VSCode 自带 markdown.preview 命令,但不会自动打开预览窗。常见错误是右键菜单找不到“Open Preview”,其实它藏在命令面板里:
- 按
Ctrl+Shift+P(Windows/Linux)或Cmd+Shift+P(macOS),输入Markdown: Open Preview回车 - 或直接按快捷键
Ctrl+K V(Windows/Linux)/Cmd+K V(macOS)——注意是先按Ctrl+K松开,再按V - 预览页默认在右侧编辑器区域打开,支持同步滚动;修改源文件后,预览会自动刷新(无需手动重载)
为什么预览不渲染数学公式或 Mermaid 图表?
VSCode 内置预览默认禁用非标准语法支持,$$...$$ 和 ```mermaid 不会被解析。解决方式有两个:
- 启用实验性支持:在设置中搜索
markdown.preview.math,勾选开启(需重启预览窗口) - Mermaid 需要额外配置:设置中开启
markdown.preview.mermaid,且确保 VSCode 版本 ≥ 1.86(旧版即使开启也无效) - 若仍不生效,检查当前文件是否确实保存为
.md后缀,且语言模式为Markdown(右下角状态栏确认)
如何让预览样式更接近 GitHub 或自定义 CSS?
VSCode 内置预览用的是简化版样式,与 GitHub 渲染差异明显。想对齐或定制,有两条路:
- 使用
markdown.extension.previewTheme设置切换主题(如github-dark.css),但仅限内置几个主题 - 真正复刻 GitHub 样式:安装扩展
Markdown Preview Github Styling(微软官方维护),启用后预览页会加载真实 GitHub CSS - 自定义 CSS:在用户设置中添加
markdown.preview.styles数组,填入本地.css路径(如["./md-custom.css"]),路径需为绝对路径或工作区相对路径
最常被忽略的一点:预览窗口一旦关闭,下次必须重新触发命令——它不会随文件打开自动激活;另外,如果同时打开了多个 Markdown 文件,每个预览是独立的,切换文件不会自动切换预览内容。










