概览
生产取向的 Electron 桌面启动模板,内置安全 IPC、认证、计费、设置、更新与一键改名。
Electron 模板面向需要发布 macOS、Windows 与 Linux 商业桌面应用的团队。 它预置了常见桌面产品的基础设施:认证、设置、自动更新管线、日志、Creem 计费、安全 IPC、安装包构建,以及一键改名脚本。
把它当作 clone-and-ship 的基础。替换默认品牌、页面、演示功能和业务逻辑, 保留 Electron 外壳与类型化进程边界。
"生产取向" 表示模板提供真实的桌面应用基础设施,不表示可以不经审查直接上线。 部分功能是 Example、Opt-in slot 或 Removable demo,发布前应按你的产品改造。
默认身份在评估阶段故意保持直白:Soar Electron、soar-electron://、
com.soarstarter.electron。准备替换时运行 pnpm rebrand,它会同步更新代码、
electron-builder.yml、包元数据和应用资源里的相关值。
技术栈
| 层级 | 选择 |
|---|---|
| 桌面运行时 | Electron 40.1、electron-builder 26.7、electron-updater 6.8 |
| UI 运行时 | React 19.2、React DOM 19.2、React Router 7.13 |
| 语言与构建 | TypeScript 5.9、Vite 7.3、electron-vite 5.0 |
| 样式 | Tailwind CSS 4.1、shadcn 风格组件、Radix UI、CVA、sonner |
| 应用状态 | zustand 5、TanStack Query 5、react-hook-form、zod 4 |
| 后端客户端 | Supabase JS 2.106,带类型化数据库访问 |
| 计费 | Creem,通过 Supabase Edge Functions 与 Supabase 权益读模型接入 |
| 桌面外壳 | Conveyor IPC、Zod 校验、设置存储、托盘、菜单、快捷键 |
| 可观测性 | electron-log、脱敏诊断、可选 @sentry/electron |
| 本地化 | i18next 与 react-i18next,英文和简体中文 |
| 测试 | Vitest 4、Testing Library、Playwright 冒烟测试 |
| 工具链 | pnpm 11.1.3、ESLint、Prettier、bundle analyzer、rebrand 脚本 |
功能状态
本根目录统一使用这些状态标签:
- Integrated - 已接入应用,默认可用。
- Flag-gated - 由构建期开关隐藏或剥离;每页会说明默认值。
- Opt-in slot - 配置完成且用户同意后才启用。
- Example - 可运行示例代码,预期由你的产品逻辑替换。
- Removable demo - 评估用演示面,带
[template-demo]标记,并有 Showcase 删除清单。
| 区域 | 状态 | 范围 |
|---|---|---|
| Shell 与 IPC | Integrated | main/preload/renderer 拆分、沙盒 renderer、contextBridge preload、Conveyor API、Zod 校验 IPC 入参与返回值 |
| 桌面界面 | Integrated | 自定义标题栏、侧边栏、命令面板、原生菜单、托盘、快捷键、日志、诊断、外部导航防护 |
| 设置 | Integrated | 带前向迁移的版本化 JSON 设置存储、备份导入导出、搜索、主题、语言、代理、存储、通知、快捷键 |
| 自动更新 | Flag-gated | VITE_AUTO_UPDATE_ENABLED 默认开启;后台/手动检查使用 electron-updater 和自托管 generic feed |
| 认证与数据 | Flag-gated / Example | Supabase 邮箱认证默认开启;profile、avatar、todos 是示例,需要按 Supabase 设置页补齐 schema |
| 计费 | Flag-gated | VITE_BILLING_ENABLED 默认关闭;配置后才启用 Creem checkout、客户门户、license mode 与 <FeatureGate> |
| 隐私插槽 | Opt-in slot | Sentry 错误上报和通用 analytics 目的地在配置且用户同意前都是 no-op |
| Showcase 目录 | Removable demo | Capability catalog、组件画廊和演示路由由 showcase flag 与 [template-demo] 标记保护 |
| 分发 | Integrated | macOS DMG、Windows NSIS、Linux AppImage/Snap/Deb、签名/公证 env hook、自托管更新元数据 |
| 开发体验 | Integrated | pnpm dev、质量门禁脚本、共置测试、bundle 分析、类型化 IPC 模式、一键改名 |
应用界面图
renderer 是运行在桌面外壳里的 React SPA:
- 侧边栏布局 - Home、Showcase、Components、Logs、Help、Settings、About, 以及启用计费后的 Billing。
- 认证 - Login、Register、Forgot Password、Reset Password 不使用主外壳。
- 设置中心 - 当前有 8 个 tab:General、Appearance、Notifications、 Shortcuts、Proxy、Storage、Updates、Advanced,并带翻译搜索。
- Account - 独立页面,处理登录用户的 profile 与 avatar 流程。
- Update page - 从 main process 流式显示检查、下载、安装、错误与 release notes。
- 命令面板 -
Cmd/Ctrl+K打开路由动作、设置快捷入口、最近文件,以及启用演示层时的 Showcase 动作。 - Onboarding gate - 首次运行引导通过 main-process 设置存储持久化;配置 EULA 后可要求接受协议。
当前 renderer 在挂载前会校验 VITE_SUPABASE_URL 与
VITE_SUPABASE_PUBLISHABLE_KEY。你可以用 .env.example 的占位值探索外壳,
但真实认证、profile、avatar、todos 和计费流程需要 Supabase 项目。
从这里开始
按这个顺序最快从 clone 走到可分发桌面应用:
