十年匠心定制 · 商业建站与技术教学双线并行 咨询热线:400-886-1026 service@lmnt.cn
ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

3 条命令装好本地图表编辑器:drawio-desktop 上手全记录

3 条命令装好本地图表编辑器:drawio-desktop 上手全记录 3 条命令装好本地图表编辑器drawio-desktop 上手全记录【免费下载链接】drawio-desktopOfficial electron build of draw.io项目地址: https://gitcode.com/GitHub_Trending/dr/drawio-desktop公司内网的微服务拓扑图刚画完你不想把它传到某个公网 SaaS 编辑器也不想为商业软件掏许可费。drawio-desktop 是 draw.io 的官方桌面版一个基于 Electron用 Web 技术构建桌面应用的框架的本地流程图工具Apache 2.0 协议商业使用不收费。画布上的所有数据只落在你的硬盘上这是它和网页版最本质的区别。拿到手下载即用无需任何运行环境按操作系统取对应安装包Windows 有三个变体NSIS 安装程序装到 Program Files需要管理员权限、MSI 包装到用户目录免管理员、免安装 exe解压就跑但不注册文件关联macOS 可走 Microsoft Store 的 APPX 版同样免管理员Linux 提供 snap 包从源码跑需要 Node.js ≥ 22.12。编辑器本体是以 git submodule 形式放在drawio/目录下的clone 时必须带上git clone --recursive https://gitcode.com/GitHub_Trending/dr/drawio-desktop cd drawio-desktop npm install npm start想边跑边看日志追加参数npm start --enable-logging。第一张图从空白画布到导出 PNG启动后直接是一张Untitled Diagram我们画一个最小流程图左侧形状库顶部有 Search Shapes 搜索框或者直接展开General分类把圆角矩形拖进中间的网格画布双击输入开始。再拖一个菱形、一个矩形用图形下方的连线锚点依次连接拖动时端点出现吸附标记再松手即可。右侧Diagram面板管视图Grid网格、Page View、Background 的开关纸张尺寸选 US-Letter 或 A4纵向/横向用 Portrait/Landscape 切换。菜单File Export as PNG弹出的是系统级文件对话框存到本地任意目录。整个导出过程不产生任何网络请求。常用快捷键记四个Ctrl/⌘Z撤销、Ctrl/⌘G编组、Ctrl/⌘ShiftV粘贴为纯文本这个快捷键在主进程层拦截网页应用抢了键位也照样生效、空格 拖拽平移画布。拆开外壳主进程如何包住编辑器整个仓库结构很干净drawio/子模块是核心编辑器src/main/只是一层薄壳分三个角色——electron.js约 4000 行管窗口创建、文件关联、关闭前未保存拦截和 CLI 导出electron-preload.js是渲染进程唯一能触碰的桥args.js集中定义所有命令行参数。其中安全设计最值得看。所有响应都经过主进程注入一条 Content-Security-Policy浏览器里限制脚本来源的策略头Content-Security-Policy: [default-src self; script-src self wasm-unsafe-eval; connect-src self]一句话解释编辑器只能执行自己目录里的脚本网络连接只能指向自己。数据不出本机不是营销话术是 CSP 强制的结果。preload 端的桥同样克制。渲染进程只能通过contextBridge注入的electron对象发请求每条消息带自增reqId由主进程应答contextBridge.exposeInMainWorld(electron, { request: (msg, callback, error) { msg.reqId reqId; // reqInfo[msg.reqId] {callback, error} ipcRenderer.send(rendererReq, msg); }, })主进程还维护一个blessedPaths白名单只有通过文件选择器、文件关联或命令行主动打开过的路径才被授权写入渲染进程连 IPC 都绕不出去。连最近打开列表都专门做了一次性迁移来补齐授权避免自动保存功能在老文件上失效。GUI 之外的三种玩法终端批量导出。同一个二进制也是无头转换器这是桌面版最实用的隐藏能力drawio -x -f png diagram.drawio drawio -x -r -f pdf ./diagrams -o ./out-r递归子目录-o指定输出输出格式从扩展名推断。输入不局限于.drawio.vsdx、.csv、Mermaid.mmd/.mermaid都能吃。自动排版。不想手动对齐时用内置的 ELK 布局引擎自动摆正图形的算法库drawio -x -f png --layout organic diagram.drawio内置organic、verticalFlow、horizontalTree等预设也可以直接传 JSON 描述自定义布局序列。布局在导出前执行一条命令出干净的图。离线化与企业部署。设DRAWIO_DISABLE_UPDATEtrue或启动时传--disable-update更新检查完全关闭应用变成 100% 离线运行适合集中管控版本的内网环境。想改代码自己打包的话doc/BUILDING_FOR_PERSONAL_USE.md 有完整流程fork → 改src/main/electron.js→npm start直接验证 → 设DRAWIO_UNSIGNEDtrue跳过签名打包。注意自构建产物不带签名系统首次启动会警告。坑与疑问Qclone 后npm start报找不到drawio/VERSION A漏了--recursive子模块没拉下来。补一句git submodule update --init即可。QCLI 导出--page-index 0突然报错退出 Av27.0.2 起页码改为 1 起始传 0 会直接exit(1)而不是默默导出第一页老脚本要同步改掉。Q启动时应用会连一次网是不是在传数据 A那是版本更新检查只访问更新服务器除此之外不发任何请求也不收集任何使用统计。介意的话--disable-update一并关掉。Q图里引用了外部图片/字体打开离线文件会请求外网吗 A会。图表内嵌的外部媒体图片、背景、字体会在打开时拉取才能正常渲染这是唯一由图表内容触发的出站路径但不传输任何图表数据。打开陌生来源的.drawio要留心这一点。Q想提 PR 加功能项目收吗 A官方明确不对代码贡献开放只收 bug 报告和功能请求。但协议是 Apache 2.0fork 自用完全合规上面第三种玩法就是正规路子。装好后先做一件事把目录里散落的.drawio文件用-x -r批量转成 PNG体会一下终端用法你就知道为什么值得把它留在工作机上了。个人构建的细节看 doc/BUILDING_FOR_PERSONAL_USE.md。【免费下载链接】drawio-desktopOfficial electron build of draw.io项目地址: https://gitcode.com/GitHub_Trending/dr/drawio-desktop创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表