如何在5分钟内上手vscode-markdown-preview-enhanced：从安装到预览的完整指南

【免费下载链接】vscode-markdown-preview-enhanced One of the "BEST" markdown preview extensions for Visual Studio Code 项目地址: https://gitcode.com/gh_mirrors/vs/vscode-markdown-preview-enhanced

vscode-markdown-preview-enhanced 是 Visual Studio Code 中一款强大的 Markdown 预览扩展，提供自动滚动同步、数学公式渲染、图表生成、PDF 导出等丰富功能，帮助用户高效编写和预览 Markdown 文档。

快速安装：30秒完成扩展部署

打开 VS Code 后，您有两种便捷的安装方式：

方法一：通过扩展面板安装

1. 按下 Ctrl+Shift+X (Windows/Linux) 或 Cmd+Shift+X (Mac) 打开扩展面板
2. 在搜索框输入 markdown-preview-enhanced
3. 找到由 shd101wyy 发布的扩展，点击 安装 按钮

方法二：通过命令行安装

如果您偏好命令行操作，可以使用 VS Code 的命令面板：

1. 按下 Ctrl+Shift+P (Windows/Linux) 或 Cmd+Shift+P (Mac)
2. 输入并执行命令：ext install shd101wyy.markdown-preview-enhanced

安装完成后，VS Code 会提示重启以激活扩展，点击 重新加载 即可。

基础预览操作：3种方式开启实时预览

快捷键预览（推荐）

在 Markdown 文件编辑界面，使用以下快捷键快速打开预览：

• 侧边预览：Ctrl+K V (Windows/Linux) 或 Cmd+K V (Mac)
• 单独窗口预览：Ctrl+Shift+V (Windows/Linux) 或 Cmd+Shift+V (Mac)

菜单操作

1. 右键点击编辑器空白处，选择 Markdown Preview Enhanced: Open Preview to the Side
2. 或通过顶部菜单 查看 > 命令面板，搜索并执行 Markdown Preview Enhanced: Open Preview

图标点击

在编辑器右上角工具栏中，找到类似眼睛的预览图标（hover 时显示 "Open Preview to the Side"），点击即可开启预览。

核心功能体验：让 Markdown 编辑更高效 ✨

实时同步与自动更新

扩展默认启用 实时更新 和 滚动同步 功能：

• 编辑 Markdown 内容时，预览窗口会自动刷新（可通过设置 markdown-preview-enhanced.liveUpdate 调整）
• 光标在编辑器中移动时，预览窗口会自动滚动到对应位置（通过 markdown-preview-enhanced.scrollSync 控制）

数学公式渲染

支持 KaTeX 和 MathJax 两种渲染引擎，轻松编写数学公式：

行内公式：$E=mc^2$
块级公式：
$$
\int_{a}^{b} f(x) dx = F(b) - F(a)
$$

可在设置中通过 markdown-preview-enhanced.mathRenderingOption 切换渲染引擎。

图表与可视化

内置支持多种图表类型，直接在 Markdown 中编写即可渲染：

• Mermaid 流程图、时序图、甘特图
• PlantUML 图表
• 交互式图表

代码块执行

支持在 Markdown 中嵌入可执行代码块（需在设置中启用 markdown-preview-enhanced.enableScriptExecution）：

print("Hello from Markdown!")

使用 Shift+Enter 运行单个代码块，Ctrl+Shift+Enter 运行所有代码块。

个性化配置：打造专属预览体验

主题切换

通过设置 markdown-preview-enhanced.previewTheme 选择预览主题，支持：

• GitHub 风格（亮色/暗色）
• Atom 风格
• Solarized 配色
• 多种代码高亮主题（通过 markdown-preview-enhanced.codeBlockTheme 设置）

自定义快捷键

如需修改默认快捷键：

1. 打开 文件 > 首选项 > 键盘快捷方式
2. 搜索 markdown-preview-enhanced 相关命令
3. 点击铅笔图标自定义快捷键

扩展功能配置

核心配置项路径：File > Preferences > Settings > Extensions > Markdown Preview Enhanced，常用设置包括：

• previewMode：控制预览模式（单预览窗口/多预览窗口）
• mathRenderingOption：数学公式渲染方式
• imageUploader：图片上传服务选择
• liveUpdateDebounceMs：实时更新延迟时间

高级使用技巧：提升效率的5个秘诀

1. 导出为多种格式

支持将 Markdown 导出为：

• HTML（带离线资源）
• PDF（通过 Chrome 或 Prince）
• EPUB 电子书
• Word 文档（需配合 Pandoc）

通过命令面板执行 Markdown Preview Enhanced: Export 选择导出格式。

2. 使用图片助手

1. 复制图片到剪贴板
2. 在 Markdown 编辑器中按下 Ctrl+Shift+P 并执行 Markdown Preview Enhanced: Open Image Helper
3. 自动生成图片 Markdown 语法并可选择上传到图床

3. 演示文稿模式

在 Markdown 中使用 --- 分隔幻灯片，通过命令 Markdown Preview Enhanced: Open Presentation Mode 进入全屏演示。

4. 自定义 CSS 样式

通过命令 Markdown Preview Enhanced: Customize CSS 编辑自定义样式表，美化预览效果。

5. 工作区配置

在项目根目录创建 .vscode/settings.json，为不同项目设置独立的预览配置：

{
  "markdown-preview-enhanced.previewTheme": "github-dark.css",
  "markdown-preview-enhanced.codeBlockTheme": "atom-dark.css"
}

常见问题解决

预览不更新？

1. 检查设置 markdown-preview-enhanced.liveUpdate 是否启用
2. 尝试手动同步：Ctrl+Shift+S (Windows/Linux) 或 Cmd+Shift+S (Mac)
3. 重启 VS Code 扩展

数学公式渲染异常？

1. 确认公式语法正确性
2. 在设置中切换数学渲染引擎（KaTeX/MathJax）
3. 检查网络连接（部分渲染资源需联网加载）

代码块无法执行？

1. 确保已启用 markdown-preview-enhanced.enableScriptExecution
2. 检查代码块语言标识是否正确（如 ```python）
3. 安装对应语言的运行环境

通过以上步骤，您已掌握 vscode-markdown-preview-enhanced 的核心使用方法。这款扩展不仅提升了 Markdown 编辑体验，更通过丰富的功能让文档创作变得更加高效和愉悦。无论是日常笔记、技术文档还是学术写作，它都能成为您的得力助手！

【免费下载链接】vscode-markdown-preview-enhanced One of the "BEST" markdown preview extensions for Visual Studio Code 项目地址: https://gitcode.com/gh_mirrors/vs/vscode-markdown-preview-enhanced