全栈视角重塑 Electron 应用开发体验:Nest 架构、多窗口、IPC 通信全解耦

🚀 打造下一代 Electron 应用架构:Nest 风格的主进程、声明式多窗口、类型安全 IPC 全解耦!

👉 项目地址:
🔗 https://github.com/X29w/electronest

在日常开发 Electron 应用的过程中,你是否遇到过以下问题:

  • 🧩 主进程代码凌乱、难以组织,无法复用?
  • 🔄 IPC 通信零散、难以管理、没有类型提示?
  • 🪟 多窗口管理全靠硬编码,创建逻辑分散难以扩展?
  • 🧪 preload 与 contextBridge 配置困难,容易踩坑?

如果你曾为这些问题感到头痛,那么你一定会喜欢我打造的这个项目 ------ Electronest


🎯 项目初衷:把 Electron 当「后端」来写

我一直认为 Electron 主进程更像是"后端",但遗憾的是大多数项目只是把它当成了「窗口启动器 + IPC 注册器」。因此,我尝试用 NestJS 架构思想 重新组织 Electron 主进程,结合现代构建工具 Vite,构建出一个具备「高内聚、强拓展、强类型」能力的 Electron 应用模板。


🧠 项目核心亮点

1️⃣ 主进程模块化架构,向 NestJS 看齐

你可以像写 NestJS 一样构建主进程:

kotlin 复制代码
@Module({
  providers: [SomeService],
  controllers: [SomeController],
})
export class SomeModule {}
  • 支持 @Injectable() 注入依赖
  • 支持生命周期钩子(如 onModuleInit
  • 支持多模块自动注册
  • 解耦主进程逻辑、提升可测试性

2️⃣ IPC 通信,类型安全、装饰器风格

通过 @IPCHandle('channel') 注册主进程的处理器:

lua 复制代码
@IPCHandle('file.read')
handleReadFile(path: string): string {
  return fs.readFileSync(path, 'utf-8')
}

渲染进程通过类型安全的 API 调用:

javascript 复制代码
const result = await window.electronAPI.invoke('file.read', 'test.txt')

✅ 自动类型推导

✅ 无需手动注册 handler

✅ 统一管理通信逻辑


3️⃣ 声明式多窗口系统,解放繁琐逻辑

每一个窗口只需用装饰器声明:

scala 复制代码
@RegisterWindow('settings')
export class SettingsWindow extends BaseWindow {
  override options = {
    width: 800,
    height: 600,
    preload: 'settings',
    url: '/settings',
  };
}

在主进程中一行代码批量注册:

kotlin 复制代码
@AutoRegisterWindows([MainWindow, SettingsWindow])
export class WindowModule {}
  • 📦 支持独立 preload
  • 🔁 跨窗口通信支持
  • 🔍 支持按名称访问窗口实例,便于逻辑复用

4️⃣ 极速开发体验 + 打包集成

  • 使用 electron-vite,极速构建体验
  • 使用 electron-builder 支持一键打包为 .exe/.dmg/.AppImage
  • 默认配置安全的 contextIsolation + preload

🧱 项目结构清晰,开发体验丝滑

bash 复制代码
electronest/
├── main-thread/        # 主进程逻辑(类似 NestJS 的 AppModule)
├── preload/            # 各窗口 preload 脚本
├── render-thread/      # 前端界面(React/Vite)
├── nest-server/        # 可选内嵌 Nest 服务(本地服务等)
  • 完全 TypeScript 项目,内置类型提示与路径别名
  • 使用 pnpm + vite 管理依赖,开发体验超丝滑

📦 快速开始

bash 复制代码
git clone https://github.com/X29w/electronest.git
cd electronest
pnpm install
pnpm dev

🛣️ 后续计划

  • ✅ 多窗口自动注册 ✔️
  • ✅ IPC 注入模块 ✔️
  • 🧩 动态模块加载机制(主进程微服务)
  • 🧪 单元测试体系(jest + mock contextBridge)
  • 🌐 内嵌 WebSocket/Nest 服务

🧑‍💻 谁适合使用这个项目?

  • 熟悉 NestJS、希望统一主进程架构的开发者
  • 希望构建多窗口、复杂通信结构的 Electron 应用
  • 注重代码质量与扩展性的前端/全栈工程师

🧾 项目地址

GitHub:

🔗 github.com/X29w/electr...

如果你喜欢这个项目,欢迎:

  • ⭐️ Star 支持
  • 🐛 提 issue 反馈
  • 🚀 一起参与开发

✨ 写在最后

Electron 不是一个"玩具",而是可以承载复杂业务逻辑的跨平台桌面平台。希望这个项目能帮助你重构对 Electron 的认知,用真正「工程化」的方式开发桌面应用。

如果你有任何建议、想法,欢迎评论或私信我一起探讨!


相关推荐
学嵌入式的小杨同学4 小时前
从零打造 Linux 终端 MP3 播放器!用 C 语言实现音乐自由
linux·c语言·开发语言·前端·vscode·ci/cd·vim
weixin_425543734 小时前
TRAE CN3.3.25 构建的Electron简易DEMO应用
前端·typescript·electron·vite·nestjs
Mr Xu_5 小时前
【Vue3 + ECharts 实战】正确使用 showLoading、resize 与 dispose 避免内存泄漏
前端·信息可视化·vue·echarts
0思必得05 小时前
[Web自动化] Selenium设置相关执行文件路径
前端·爬虫·python·selenium·自动化
雯0609~5 小时前
hiprint:实现项目部署与打印1-官网提供普通html版本
前端·html
不绝1916 小时前
UGUI——进阶篇
前端
Exquisite.6 小时前
企业高性能web服务器(4)
运维·服务器·前端·网络·mysql
2501_944525547 小时前
Flutter for OpenHarmony 个人理财管理App实战 - 账户详情页面
android·java·开发语言·前端·javascript·flutter
2601_949857437 小时前
Flutter for OpenHarmony Web开发助手App实战:快捷键参考
前端·flutter
wangdaoyin20107 小时前
若依vue2前后端分离集成flowable
开发语言·前端·javascript