应安装 Draw.io Integration（作者 Hediet，版本≥1.5.0），右键文件选“Open Diagram”打开编辑，导出PNG时需勾选“Use device pixel ratio”并可调缩放提升清晰度，Markdown中嵌入需用特定代码块语法且不自动回写。
VSCode 里直接用 Draw.io 画流程图是可行的，但不是开箱即用——必须装插件，且默认不支持本地离线编辑 .drawio 文件（会跳转浏览器）。
装哪个插件？Draw.io Integration 还是 Diagrams.net Integration？
只装 Draw.io Integration（作者是 Hediet），别选同名但作者不同的旧版。新版已更名为 Diagrams.net Integration，但市场里仍显示为前者，安装时认准发布者是 Hediet，版本号 ≥ 1.5.0。
- 旧版
drawio-vscode（作者 jgraph）已停止维护，打开 .drawio 文件会强制跳转浏览器，无法内嵌预览 - 新版支持 VSCode 内嵌编辑器、实时预览、Ctrl+Z 撤销、缩放、导出 PNG/SVG 等核心功能
- 安装后重启 VSCode，否则右键菜单不出现 “Open Diagram” 选项
如何打开和编辑 .drawio 文件？
不能双击打开，也不能拖进编辑区——必须右键文件 → 选择 Open Diagram。这是最常卡住的一步。
- 如果右键没这个选项，说明插件未激活或文件关联失败，可手动执行命令面板（Ctrl+Shift+P）→ 输入
Draw.io: Open Diagram - 首次打开会提示是否启用自动保存，建议勾选；否则修改后关闭标签页可能丢失未保存内容
- 编辑器底部状态栏显示当前缩放、页面尺寸、网格开关等，点击可快速切换
为什么画完导出的 PNG 模糊？怎么调清晰度？
默认导出使用 1x 渲染，高分屏下明显模糊。需手动改导出参数，不是调 VSCode 设置，而是改插件内部导出逻辑。
- 导出前先按 Ctrl+Shift+P → 执行
Draw.io: Export As→ 选 PNG - 在弹出的导出对话框中，勾选
Use device pixel ratio（关键！） - 如仍不够清，可在导出前右键画布 →
Zoom→ 设为 200% 或更高，再导出（等效提升渲染分辨率） - 注意：SVG 导出无此问题，矢量原生清晰，适合插入文档或网页
能不能像 Typora 那样在 Markdown 里嵌入 drawio 图形？
可以，但不是实时渲染，需配合特定语法和插件联动。
- 在 Markdown 文件中用如下代码块包裹 base64 内容：
```drawio <diagram name="xxx">...</diagram> ```
- 需要额外安装
Markdown Preview Mermaid Support类插件不生效；必须用Draw.io Integration自带的预览能力：右键代码块 →Draw.io: Open Diagram from Code Block - 修改图形后，需手动更新代码块里的 XML 内容（插件不会自动回写），建议把图单独存为 .drawio 文件，再用  引用（VSCode 不解析该链接，仅作标记）
真正麻烦的是跨设备同步：.drawio 文件本质是 XML，但含相对路径、字体引用、本地图片 base64 等，换电脑打开可能丢样式或图元。别依赖“开箱即用”，每次迁移前先检查 <mxGraphModel> 根节点里的 dx/dy 和 gridSize 是否异常。
