使用 draw.io 和 github.dev 直接在 GitHub 中编辑图表
对于开发者而言，github.dev 允许您在基于 Web 的代码编辑器中编辑存储在 GitHub 仓库中的文件。它拥有 Visual Studio Code 的诸多优势，例如搜索、语法高亮和源代码控制视图。在基于 Web 的编辑器中安装非官方的 draw.io Visual Studio Code 扩展后，您无需离开浏览器即可快速浏览、查看和编辑存储在 GitHub 仓库中的图表文件。
使用基于 Web 的代码编辑器来编辑 GitHub 代码。
当您希望在 Web 浏览器中使用更多编辑和语法高亮功能，以便在 GitHub 存储库中逐步执行、测试和编辑代码时，github.dev版本的网站非常有用。
这款轻量级的基于 Web 的编辑器完全在浏览器的沙盒中运行，类似于我们的免费在线图表编辑器，并且与桌面代码编辑器不同，它不需要显式克隆存储库即可使用其中的文件。
更多详情请参阅github.dev 文档。
使用 github.dev 编辑仓库中的图表
您还需要一个可视化编辑器来编辑通常随附于 GitHub 中存储的软件文档和项目的图表文件。
由 Henning Dieterichs 开发的非官方 draw.io 扩展程序，允许您通过基于 Web 的编辑器快速轻松地浏览、更新和添加存储库中的图表和可视化文档集合。
在 github.dev 中打开你的仓库
在浏览器中，访问 github.com 上您想要操作的存储库，并确保您已登录到您的 GitHub 帐户。
.com将URL 中的相应部分替换为 `<URL>.dev` 并重新加载页面。
例如，从https://github.com/jgraph/drawio-diagrams`<URL>`替换为 `<URL>`。https://github.dev/jgraph/drawio-diagrams
安装图表绘制扩展程序
点击左侧菜单中的“扩展”
Shift+Ctrl+X选项卡，或者在 Windows 系统中按“扩展”，Shift+Cmd+X在 macOS 系统中按“扩展”。搜索
draw.io并点击安装由 Henning Dieterichs 开发的非官方扩展程序。
图表绘制扩展程序将全局启用，并将一直保持启用状态，直到您清除浏览器缓存为止。
了解如何在 Visual Studio Code 中使用非官方的 draw.io 扩展。
编辑存储库中的图表文件
.drawio现在您可以直接在浏览器中编辑带有特定文件后缀的图表文件。
导航至您在左侧面板中打开的存储库中的图表文件。单击该文件后，图表编辑器将在右侧窗格中打开。
编辑图表时，更改会自动保存。左侧的存储库列表会更新，显示文件已编辑。
将编辑后的图表提交到存储库
在将您对图表文件所做的更改提交到基于 Web 的代码编辑器之前，您可以比较图表的两个版本。
转到左侧的“源代码控制”选项卡，查看已更改的文件。
点击
.drawio文件即可并排打开原始版本和编辑版本，以便比较这两个版本。暂存并提交您的更改以保存和更新您的存储库。