企业官网建设流程全解析

draw.io 桌面版 Windows 安装：三种 CPU 架构对应 3 个安装包，离线画完第一张图

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

朋友在方案咨询行业，客户审计卡得死：在线 SaaS 一律禁用，交付架构图必须能在断网电脑上画出来。draw.io 桌面版就是给这种场景准备的——Electron（把网页应用装进本地窗口运行的框架）打包的绘图程序，官方定位是与互联网彻底隔离，图表数据不出本机。读完这篇，你能挑对与 CPU 架构匹配的安装包、导出第一张 PNG，并把自动更新检查彻底关掉。

⚖️ 核对 CPU 架构，锁定该下哪个 draw.io 安装包

先查机器是什么架构。右键"此电脑" → 选"属性" → 看"系统"一栏的"系统类型"，例如显示"基于 x64 的处理器"。处理器架构对照下面的表选包，文件名以发布页实际列表为准：

判断依据是"基于 XX 的处理器"那一行，不是"64 位操作系统"那几个字。最常见的误判：64 位系统一律下 x64 包——ARM 笔记本同样是 64 位，装 x64 包只能跑在模拟层上，又慢又费电。

选完架构再选安装方式。发布页一共三种 Windows 包，NSIS 和 MSI 是两种常见的 Windows 打包格式，差别只在内部分发方式：

建议：这台机器长期自用且有管理员权限，选 NSIS；公司电脑没有管理员权限，选 MSI（Microsoft Store 版同样按用户安装、免管理员）。想拷进 U 盘临时画两张图，选便携版。

✅ 走通安装到第一张 PNG 的最短路径

1. 右键"此电脑" → 选"属性" → 核对"系统类型"，按上一节的表确定安装包。
2. 运行安装包：NSIS 需要管理员权限（UAC 弹窗点"是"），装进C:\Program Files；MSI 以当前用户身份运行，装进用户目录；便携版解压后直接运行exe。
3. 从开始菜单启动 draw.io。每个用户同一时间只允许一个实例，重复启动只会把焦点转到已有窗口，不是装坏了。
4. 在左侧 General 分类按住矩形图标，拖到中央画布松开落位；找不到图形就在 Search Shapes 里搜英文名。
5. 再拖一个形状，从第一个形状边缘按住拖线到第二个，自动出现连接线。
6. 单击选中形状，右侧面板切成它的样式设置，在这里改填充色和边框；点空白画布，右侧显示页面设置。
7. 菜单 File → Save as，存成.drawio文件；再走 File → Export as，格式选 PNG，导出到桌面。

验收标准：桌面上出现这张图导出的 PNG 文件。能打开看，整条链路就通了。

📌 装完要盯住的数据位置与更新开关

• 图表与本地状态：.drawio文件存在哪由你决定，双击即可重新打开编辑。C:\Users\<用户名>\AppData\Roaming\draw.io\存的是窗口状态、自动保存草稿和本地设置，定期拷贝这个目录等于给工作现场上了双保险。
• 自动更新默认是开着的：启动时会检查新版，发现新版直接下载并在关闭应用时安装，全程静默、不弹提示。想彻底关掉，设系统环境变量DRAWIO_DISABLE_UPDATE=true，或在快捷方式"目标"末尾加--disable-update。折中方案：加--no-silent-update，保留更新但下载前先弹窗询问。
• 远程脚本被 CSP 挡死：内容安全策略（限制网页能加载哪些外部资源）在启动时注入，禁止远程 JavaScript 执行，图表数据不会外发。唯一的例外：图表里若嵌了外部图片、背景或字体的 URL，打开文件时会向这些地址发请求——来源不明的.drawio文件先确认出处再打开。

画图链路已跑通，但想让这台机器从此彻底离线，先处理上面第二个开关。

🛠️ 开发者支线：从源码构建 Windows 安装包

前提：Node.js 22.12 以上（package.json里写死的下限），编辑器核心drawio是 git 子模块，克隆必须递归拉取。

git clone --recursive https://gitcode.com/GitHub_Trending/dr/drawio-desktop cd drawio-desktop npm install npm start

--recursive：连drawio子模块一起拉下来，缺了它构建直接失败；npm start：直接从源码树跑应用，验证改动能不能跑通。日常就在开发机上用的话，到这一步就够了，不必打安装包。

要出 Windows 安装包：

npm run sync -- disableUpdate $env:DRAWIO_UNSIGNED="true" npx electron-builder --config electron-builder-win.json --publish never

• sync -- disableUpdate：把drawio/VERSION的版本号戳进package.json，并让构建出的应用不自动更新，防止它默默升回官方版把你的修改冲掉。
• DRAWIO_UNSIGNED="true"：跳过代码签名——个人构建没有签名证书，只作用于当前终端会话，换个终端要重设。
• --publish never：产物留在本地dist/，不往发布渠道推。

这条命令会产出 NSIS 安装程序和 MSI 包。没签名的包运行安装程序时 Windows 会弹 SmartScreen 警告，点"更多信息 → 仍要运行"即可。非官方构建不享受官方支持，也别把它当 draw.io 分发给别人。npm run release-*脚本会把产物发布到 release 渠道，那是 CI 的路，本地构建别走；更完整的流程见 doc/BUILDING_FOR_PERSONAL_USE.md。

🩺 排障速查：五类高频问题

Q1：双击.drawio没反应，或者被别的程序抢走了？最可能：文件关联被看图软件或 Office 抢占；便携版则是预期行为——它本来就不注册文件关联。解法：右键文件 → "打开方式" → 指定 draw.io 并勾选"始终使用此应用打开"。便携版用户先双击启动应用，再用 File → Open 手动打开文件。

Q2：便携版拷进 U 盘后打不开？最可能：路径问题，带空格或中文的目录最容易出故障。解法：先把exe拷回本机短英文路径测试——能跑就是 U 盘路径的锅，换到D:\tools这类短路径即可；本机也打不开才是包本身坏了。

Q3：断网环境启动时提示更新失败，是故障吗？这是预期行为：更新检查默认指向外网，断网必然失败，画图功能完全不受影响。嫌提示烦就按 📌 一节的办法关掉；只想改提示方式就加--no-silent-update，变成下载前弹窗询问。

Q4：想在命令行批量把图转成图片？用导出参数：

drawio --export --format png --output out\ 我的图.drawio

--export进入导出模式（也支持 vsdx、csv、Mermaid 输入）；--format可选 pdf、png、jpg、svg、xml、html，不写默认 pdf；--output指向目录时批量文件各存各的，多个输入文件指定单个输出文件会被直接拒绝。全部参数跑--help查看。

Q5：窗口画面撕裂、花屏或卡顿？最可能：硬件加速与显卡驱动不兼容。解法：启动参数加--disable-acceleration关掉硬件加速再试；仍然不行，查显卡驱动。

📋 收尾验证清单

1. 看"系统类型"那一行，确认手里的安装包和处理器架构对得上。
2. 应用能启动，第一张图已导出成 PNG。
3. 断网环境已设DRAWIO_DISABLE_UPDATE=true，或快捷方式带--disable-update，启动后不再尝试外连。

三项都过，这台机器的 draw.io 就可以放心进生产环境了。

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