AI 摘要Drawnix 是一款强大的开源白板工具，集成思维导图、流程图等功能。基于 Plait 框架开发，支持插件扩展，提供自动保存、无限画布等特性。UI风格感觉和Excalidraw挺像。
相比市面上各种需要登录和会员的软件，Drawnix可谓是降维打击。
- 💯 免费 + 开源
- ⚒️ 思维导图、流程图
- 🖌 画笔
- 😀 插入图片
- 🚀 基于插件机制
- 🖼️ 📃 导出为 PNG， JSON
- 💾 自动保存（浏览器缓存）
- ⚡ 编辑特性：撤销、重做、复制、粘贴等
- 🌌 无限画布：缩放、滚动
- 🎨 主题模式
- 📱 移动设备适配
- 📈 支持 mermaid 语法转流程图
- ✨ 支持 markdown 文本转思维导图
本教程将详细介绍如何利用EdgeOne Pages这一免费且高性能的静态网站托管服务，将 Drawnix 白板工具部署到全球边缘网络，实现免服务器、低成本、高可用的访问体验。
前期准备
在开始部署之前，请确保完成以下准备工作：
1. 注册 EdgeOne 账号
首先，访问 EdgeOne 官方网站 并完成账号注册。注册成功后，登录 EdgeOne 控制台。
区域选择注意事项：
在创建 Pages 项目时，您需要选择服务区域。
- 全球可用区（不含中国大陆）：此选项适用于所有用户，即使您的域名没有进行 ICP 备案，中国大陆用户也能访问，但速度可能会略慢。
- 全球可用区：此选项要求您的域名已完成 ICP 备案，并且已在腾讯云进行实名认证。选择此区域可获得在中国大陆地区地区的CDN。
本教程后续步骤将以“全球可用区（不含中国大陆）”为例进行演示。
2. Fork Drawnix GitHub 仓库
访问 Drawnix 的官方 GitHub 仓库：https://github.com/plait-board/drawnix/。
点击页面右上角的 Fork 按钮，将 Drawnix 仓库复制一份到您自己的 GitHub 账户下。这将允许您拥有一个可自由修改和部署的 Drawnix 代码副本。
部署步骤
1. 配置 EdgeOne Pages 项目
登录 EdgeOne 控制台，在 服务总览 页面点击至 Pages（Bate） 服务。
-
点击 创建项目 按钮。
-
选择 导入Git仓库 。
-
然后需要在GitHub授权EdgeOne Pages，授权成功后你就能在 导入Git仓库 页面你的所有GitHub仓库了。选择你刚刚
Fork的 Drawnix 仓库，然后点击即可。
-
来到 创建项目 页面，填写项目的详细配置
-
在 配置项目 部分，按照以下内容填写配置：
- 框架预设：
Vite - 根目录：
./ - 输出目录：
dist/apps/web - 编译命令：
npm run build:web - 安装命令：
npm install
这些配置指示 EdgeOne Pages 在部署时如何构建项目并将最终的静态文件发布。
- 框架预设：
2. 绑定自定义域名
部署成功后，默认会提供一个 项目名称.edgeone.app 的子域名，但是此域名只是提供一个几小时的预览功能，并不能之间使用，每次访问还需要携带一个token。为了让您的 Drawnix 白板拥有一个独立的访问地址，您需要绑定自定义域名。
- 在 EdgeOne Pages 的drawnix项目设置页面，在项目设置中找到 “添加自定义域名”。
- 在弹出的对话框中，输入您准备好的自定义域名，网上很多的免费二级域名也可以。
- 配置 DNS 记录：根据弹窗中提供的 DNS 记录信息，前往您的域名注册商网站，配置相应的 CNAME 记录。
- 点击 “验证”。EdgeOne会自动检测你自定义域的 CNAME 记录值，EdgeOne Pages 会自动部署提供免费的 SSL/TLS 证书，自动配置 HTTPS。
结尾
通过以上步骤，你就已成功地利用腾讯云 EdgeOne Pages 平台，将开源白板工具 Drawnix 部署到了公网，并通过自定义域名实现了全球访问。