用途:在构建跨平台桌面应用、处理 Electron 主进程与渲染进程、实现 IPC、集成原生系统能力(菜单、通知、文件系统)、搭配 React/Vue 等框架以及配置自动更新和分发时加载本技能。
主要能力与模式: 项目结构:建议将代码分为 main(主进程,含 ipc、services、windows)、renderer(渲染进程)、preload(预加载脚本)和 shared(共享类型)四部分。 安全 IPC:通过 contextBridge 暴露经过筛选的 API,支持单向 send、双向 invoke 和监听 on 三种通信方式,且仅暴露具体方法而非整个 ipcRenderer。 类型安全通道:在 shared/types.ts 中用 IpcChannels 接口统一定义各通道的 request/response 类型,并扩展 Window 接口。 主进程设置:创建 BrowserWindow 时启用 contextIsolation、关闭 nodeIntegration、开启 sandbox;开发环境加载本地 URL 并打开 DevTools,生产环境加载打包文件。 IPC 处理器:使用 ipcMain.handle 实现获取版本、读写文件、原生对话框、electron-store 持久化存储等。 React 集成:提供 useIPC、useIPCListener、useIPCMutation 等自定义 Hook。 自动更新:基于 electron-updater 监听检查、可用、下载进度、已下载和错误事件,并通过 IPC 暴露检查、下载、安装操作。 原生菜单:用 Menu.buildFromTemplate 构建含 Mac 专属菜单项、快捷键的文件/编辑/视图/帮助菜单,并通过 webContents.send 通知渲染进程。
使用方式:可用 npm create electron-vite@latest 创建项目;主进程内直接用 Node.js 的 fs,渲染进程访问文件必须经 preload 走 IPC;持久化存储用 electron-store,自动更新用 electron-updater;通知用 new Notification(),系统托盘用 Tray,全局快捷键用 globalShortcut.register(),深链用 app.setAsDefaultProtocolClient(),代码签名通过 electron-builder 配置。
反模式与限制:不要开启 nodeIntegration 或关闭 contextIsolation,不要使用已废弃且不安全的 remote 模块,不要整体暴露 ipcRenderer,只暴露受白名单限制的具体方法。资料未提供具体版本要求、收费或许可信息,暂未提供。