news 2026/11/6 4:56:12

drawio-desktop 完整指南:离线免费画流程图与架构图

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
drawio-desktop 完整指南:离线免费画流程图与架构图

drawio-desktop 完整指南:离线免费画流程图与架构图

【免费下载链接】drawio-desktopOfficial electron build of draw.io项目地址: https://gitcode.com/GitHub_Trending/dr/drawio-desktop

drawio-desktop 是 draw.io 官方桌面版,把核心编辑器打包成 Electron 应用。流程图、架构图、思维导图全部本地渲染,断网照样画,个人和公司都能免费用。

为什么需要它

浏览器里画图,一半的麻烦来自网络。你在网页里画了一半,标签页被关、网络被切,编辑状态就悬空在那。

更典型的是内网场景。公司内网机器连不上外网,网页版编辑器根本加载不出来,而 drawio-desktop 的所有 JavaScript 都内置在本机,局域网、断网环境都能跑。

还有一类顾虑是隐私。应用的内容安全策略(CSP)禁止执行任何远程加载的脚本,图的内容本身不会外发,适合画包含业务信息的架构设计图。

装好它:离线安装步骤

前提是本机装好 Node.js,版本不低于 22.12.0(package.json 的engines字段写明了这个下限)。

🚀 第一步,检查 Node 版本:

node -v

完成标志:输出类似v22.x.x且不低于 22.12.0,低于就升级 Node。

🚀 第二步,克隆源码。draw.io 核心是以 git 子模块形式挂在drawio/目录下的,必须带--recursive:

git clone --recursive https://gitcode.com/GitHub_Trending/dr/drawio-desktop

完成标志:drawio/目录里有完整的 draw.io 代码,而不是一个空文件夹。

🚀 第三步,在仓库根目录安装依赖:

npm install

完成标志:node_modules生成完毕,Electron 等开发依赖就位,无报错。

🚀 第四步,启动应用:

npm start

完成标志:electron .被拉起,几秒后弹出 draw.io 主窗口,左侧形状库、中间画布直接可用。

🚀 第五步(可选),启动后行为异常时带日志再跑一次:

npm start --enable-logging

完成标志:控制台持续输出主进程日志,方便定位卡在哪一步。

数据存在哪里,会不会联网

你的 Local Storage 与 Session Storage 落在系统应用数据目录:

  • macOS:~/Library/Application Support/draw.io
  • Windows:C:\Users\<用户名>\AppData\Roaming\draw.io\

网络侧,应用被设计成与外网隔离:唯一的外部请求是每天最多一次连接 github.com 查新版本,更新包从 GitHub 名下的 AWS S3 桶下载。

想彻底离线,任选其一:设环境变量DRAWIO_DISABLE_UPDATE=true,或启动时传--disable-update。实现见 src/main/electron.js。

⚠️ 一个例外:图文件如果嵌入了 URL 形式的外部资源(图片、背景、字体),打开时会去拉取这些资源以正常渲染,这会把你的 IP 暴露给对方服务器。图的内容本身不会外发,但陌生来源的图文件别轻易打开。

速查表:关键文件与命令

文件 / 命令作用
package.jsonnpm 脚本与依赖定义,start脚本实际执行electron .
src/main/electron.js主进程入口,窗口、更新检查、日志都在这里
src/main/electron-preload.js预加载脚本,隔离主进程与渲染层
electron-builder-win.jsonWindows 安装器打包配置
electron-builder-linux-mac.jsonLinux / macOS 打包配置
sync.cjs构建前从 draw.io 子模块读取版本号并同步依赖
src/test/CLI 参数、窗口边界等模块的单元测试
npm start启动应用
npm start --enable-logging带日志启动,排查启动问题
DRAWIO_DISABLE_UPDATE=true/--disable-update关闭全部更新检查

避坑清单

⚠️drawio/目录是空的:克隆时漏了--recursive,子模块没拉下来,后续什么都跑不起来,重新带参数克隆即可。

⚠️ 依赖放错位置:draw.io 子模块war/package.json的 dependencies 会原样打进安装包,开发期才用的包必须放 devDependencies,DEVELOPMENT.md 里专门警告过。

⚠️ 更新子模块顺序乱了:要先在子模块里提交变更、打上版本 tag,再回到本仓库推送,推送动作才会触发 CI 构建。

⚠️ 打开陌生图文件后出现意外外联:图中嵌入了外部 URL 资源,打开时会被拉取,来源不明的图先别急着打开。

⚠️ 找不到官方支持渠道:支持走仓库 issue 系统,非付费用户没有私人工单,购买 Confluence / Jira 版本也不包含 desktop 支持。

继续深入

  • DEVELOPMENT.md:开发环境与 CI 构建细节
  • doc/RELEASE_PROCESS.md:发布、签名与构建流程
  • doc/BUILDING_FOR_PERSONAL_USE.md:给自己打一个未签名构建
  • SECURITY.md:安全策略说明

【免费下载链接】drawio-desktopOfficial electron build of draw.io项目地址: https://gitcode.com/GitHub_Trending/dr/drawio-desktop

创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/11/6 4:51:41

Visual Studio Code 配置 java/maven 环境(Windows版)

1. 安装 JDK 进入Oracle官网下载jdk&#xff0c;本文已jdk8为主 官网下载地址&#xff1a;Java Downloads | Oracle 配置系统环境变量&#xff1a; 1) JAVA_HOME 创建系统环境变量 JAVA_HOME, 赋值为 jdk安装路径 (Maven 由 Java 开发&#xff0c;执行时需用到环境变量 JAVA_…

作者头像 李华
网站建设 2026/11/6 4:49:10

Spring配置补充 (随笔详情扩展:)

Spring配置补充&#xff1a; 实现Spring 和 MyBatis 集成过程中学习了,Spring 的配置数据源的方法; 实际开发过程中还有很多灵活的配置文件; 灵活配置DataSource: <!-- 远古方法&#xff08;最初方法&#xff09;,数据库连接池,不过我最喜欢用的; --><bean id"…

作者头像 李华
网站建设 2026/11/6 4:45:57

EtherCAT芯片方案选型:嵌入式接口与网关集成路径全面对比

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

作者头像 李华
网站建设 2026/11/6 4:45:42

STM32系统级设计:从理论到工程实践的核心要点

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

作者头像 李华
网站建设 2026/11/6 4:43:58

智能车开源硬件全解析:从电源设计到电机驱动的实战避坑指南

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

作者头像 李华