用 AI 做一个桌面端应用

30 秒判断：这个教程适合你吗？

Electron vs Tauri：选哪个？

结论：MVP 阶段用 Electron。 安装包大点无所谓，先验证想法最重要。等产品跑通了再考虑用 Tauri 重写优化。

第一步：创建 Electron 项目（5 分钟）

mkdir my-desktop-app && cd my-desktop-app
npm init -y
npm install electron --save-dev
npm install electron-builder --save-dev

然后用 Cursor 或 Windsurf 打开项目文件夹。

第二步：搭建基础结构（10 分钟）

让 AI 帮你生成基础文件。在 AI 对话框输入：

我在做一个 Electron 桌面应用。项目已经 npm init 并安装了 electron 和 electron-builder。

请帮我创建基础文件结构：
1. main.js - 主进程，创建窗口
2. preload.js - 预加载脚本
3. index.html - 主页面
4. renderer.js - 渲染进程脚本
5. 更新 package.json 的 main 字段和 scripts

要求：
- 窗口大小 1200x800
- 开发时打开 DevTools
- 支持 macOS 和 Windows

生成后在终端运行：

npm start

你应该能看到一个桌面窗口弹出来。

第三步：用 AI 构建功能（1-2 小时）

现在开始做你的核心功能。Electron 的好处是前端就是网页，你可以用任何前端框架。

在现有 Electron 项目基础上，帮我实现 [你的核心功能]。

技术要求：
- 前端直接用原生 HTML/CSS/JS（MVP 不需要框架）
- 需要读写本地文件的功能用 Node.js fs 模块，通过 preload.js 暴露给渲染进程
- 界面简洁实用，不需要花哨的动画

Electron 开发的几个关键概念：

• 主进程（main.js）：管理窗口、系统交互，能用 Node.js 全部 API
• 渲染进程（网页）：就是普通网页，默认不能直接用 Node.js
• preload.js：桥梁，把主进程的能力安全地暴露给网页

AI 有时候会在渲染进程里直接 require('fs')，这在新版 Electron 里不行。如果遇到这个问题，告诉 AI 用 contextBridge 和 ipcRenderer 的方式。

第四步：打包分发（20 分钟）

在 package.json 里加上打包配置（让 AI 帮你写），然后：

# 打包当前平台
npx electron-builder

# 只打 Mac 包
npx electron-builder --mac

# 只打 Windows 包（在 Mac 上交叉编译）
npx electron-builder --win

打包完成后，安装包在 dist 文件夹里。

打包常见问题：

• Mac 上打包 Windows 版本：需要安装 Wine（brew install --cask wine-stable）
• Mac 应用签名：不签名也能用，但用户打开时会提示"无法验证开发者"，需要右键→打开
• Windows 安装包被杀毒软件拦截：正常现象，没有代码签名证书就会这样，让用户手动允许即可

第五步：分发给用户

MVP 阶段不需要上架应用商店，直接发安装包：

1. 把安装包传到网盘（百度网盘、阿里云盘）或 GitHub Releases
2. 发给目标用户，附上简单的安装说明
3. 收集反馈，快速迭代

如果后续要正式分发：

• Mac：可以公证（notarize）后分发，或上架 Mac App Store
• Windows：可以购买代码签名证书（约 $200/年），或上架 Microsoft Store

做完之后

你现在有了一个能在桌面运行的应用。接下来：

1. 发给 10 个目标用户，看他们能不能顺利安装和使用
2. 关注安装环节的问题：桌面应用最大的流失点就是安装
3. 考虑自动更新：electron-updater 可以实现应用内自动更新
4. 如果用户量增长，考虑用 Tauri 重写以减小安装包体积
5. 想先做个网页版？ 看看 1 小时 AI 速建 MVP 网站，零安装门槛