Electron桌面应用开发:从0到1的完整实践

0 阅读1分钟

Electron桌面应用开发:从0到1的完整实践

以辰入梦短剧生成系统为例,分享Electron桌面应用开发经验。

项目背景

辰入梦是一款AI短剧创作工具,帮助用户从剧本到视频的完整流程。

技术栈:Electron 40.x + Vue 3 + Vite + Node.js + SQLite

项目结构

├── main/           # Electron主进程
├── src/            # Vue3前端
├── server/         # Express后端
├── electron/       # Electron配置
└── package.json

关键实现

1. 双进程架构

主进程:管理窗口生命周期、系统托盘 渲染进程:Vue3前端 后端进程:Express服务(localhost:3001)

2. 本地服务启动

应用启动时,主进程spawn后端服务:

const server = spawn("node", ["server/index.js"], {
  env: { ...process.env, PORT: 3001 }
});

3. 数据库初始化

首次启动自动创建SQLite数据库和表结构。

4. AI API调用

图片/文本/视频AI全部通过后端API调用。

前端只负责展示和交互。

打包部署

使用electron-builder打包NSIS安装包。

支持Windows 10/11 64位。

总结

Electron + Vue3 + SQLite是桌面应用的好选择。

官网:chenrumeng.cn