vscode内置markdown预览不支持mermaid等图表渲染，必须安装markdown preview enhanced（mpe）插件；安装后通过ctrl+shift+p运行“open preview to the side”，确保代码块标注`mermaid，右下角显示“mermaid: ready”，修改后需手动刷新预览，导出pdf优先选用chrome（puppeteer）引擎并配置style.less强制宽度。
VSCode内置预览不支持Mermaid和图表渲染
VSCode自带的Markdown Preview功能完全不识别mermaid、plantuml或graphviz等图表语法——你写再多```mermaid代码块，预览里只会显示原始文本。这不是配置问题，是能力缺失。它连基础数学公式都不支持，更别说图表。
必须装 Markdown Preview Enhanced 插件
想在编辑器内实时看到流程图、时序图、类图，Markdown Preview Enhanced（简称 MPE）是目前唯一稳定、维护活跃、且原生支持图表渲染的方案。别试其他小众插件，它们要么已停更，要么只支持部分语法。
- 安装后，用
Ctrl+Shift+P输入Markdown Preview Enhanced: Open Preview to the Side启动预览（不是默认的Ctrl+Shift+V） - 确保你的图表代码块明确标注语言：
```mermaid、```plantuml，不能只写``` - MPE 默认启用 Mermaid 渲染；PlantUML 需额外安装本地服务或配置在线服务器（如
https://www.plantuml.com/plantuml/png/） - 若图表不出现，检查右下角状态栏是否显示
Mermaid: ready—— 没有则说明 JS 加载失败，常见于工作区未受信任或网络策略拦截
图表不刷新或显示空白的典型原因
改完 mermaid 代码后预览没变化？不是 bug，是 MPE 的默认行为：它不会监听代码块内容变更自动重绘。你得手动触发。
Markdown to PDF Converter (v2.0)
下载
离线Markdown转PDF转换器，基于Pandoc与WeasyPrint，支持完整Unicode及本地表情缓存，可将Markdown转为专业级PDF...
- 保存文件后按
Ctrl+R刷新预览窗格（光标需在预览页内） - 右键预览区域 →
Reload Preview（比快捷键更可靠） - 如果显示「Cannot load script」或白屏，大概率是工作区未被信任：点击右下角
此文件夹不受信任→信任此 workspace - 某些企业环境禁用了内联脚本，需在 MPE 设置中开启
markdown-preview-enhanced.enableScriptExecution（设为true）
导出含图表的 PDF 时字体/布局错乱
用 MPE 导出 PDF 时，mermaid 图常变小、文字糊成一团、甚至整个图消失——这不是 CSS 能简单修好的事，根源在渲染引擎差异。
- 优先选
Chrome (Puppeteer)导出方式（右键预览页 →Export to PDF→ 选该选项），它能正确执行@media print规则 - 在 MPE 的
style.less全局样式里加这条规则，强制图表容器宽度：.mermaid { width: 100% !important; } - 避免在 mermaid 代码中使用中文标签（如
A[用户登录]），改用英文或加引号：A["用户登录"]，否则 Puppeteer 渲染易崩溃 - 超大流程图建议拆分成多个子图，单个 mermaid 块超过 200 行时，PDF 导出成功率明显下降
MPE 的图表支持虽好，但所有渲染都发生在 WebView 内，没有真正“编辑即所见”。改完图后必须手动刷新，导出前务必用 Chrome 引擎试一次——这两步跳过，90% 的 PDF 问题就源于此。
