SuperAPI AI 工具集

electron-desktop

编程与开发

查看项目

更新于 10-16 10:40

技能介绍

用途

本技能用于使用 Electron 框架开发 Windows、macOS、Linux 跨平台桌面应用。适用于构建跨平台桌面软件、实现原生操作系统功能,或将 Web 应用打包为桌面应用。

支持的平台

平台 架构 备注
Windows x64, arm64, ia32 Windows 10+
macOS x64, arm64 (Apple Silicon) macOS 10.15+
Linux x64, arm64, armv7l 大多数发行版

项目结构

资料给出了标准目录结构,分离主进程(main)、渲染进程(renderer)和共享代码(shared),并在 resources 中按平台放置不同格式的应用图标(icns、ico、png),配置文件包括 electron-builder.yml、package.json 和 forge.config.ts。

主要能力

  • 主进程:创建 BrowserWindow,配置窗口尺寸、安全选项(contextIsolation、nodeIntegration、sandbox)、标题栏样式和显示时机;区分开发与生产环境加载 URL 或本地文件。
  • Preload 脚本:通过 contextBridge 向渲染进程暴露受控 API,包括文件打开/保存、获取版本、窗口最小化/最大化/关闭,以及更新可用的事件订阅与退订;同时提供 TypeScript 类型声明。
  • IPC 通信:使用 ipcMain.handle 与 ipcMain.on 处理文件对话框、读写文件、窗口控制等操作。
  • 渲染进程(React):在组件中调用暴露的 API,实现版本获取、文件打开保存、更新提示、自定义标题栏控件;配合 CSS 使用 -webkit-app-region 实现可拖拽标题栏。
  • 原生功能:系统托盘(Tray + 菜单 + 提示 + 点击事件)、原生应用菜单(含快捷键 accelerator 与 role)、系统通知(Notification)、自动更新(electron-updater 的检查、下载与安装事件)。

使用方式

代码以 TypeScript 编写,前端使用 React,打包使用 electron-builder。资料提供了 electron-builder.yml 配置示例,涵盖 appId、productName、mac(dmg/zip、x64/arm64、hardenedRuntime、notarize)、win(nsis)、linux(AppImage/deb/rpm)以及 GitHub 发布配置。构建命令包括开发(npm run dev)、当前平台构建、全平台构建以及指定平台构建。

安全实践

建议:始终使用 contextIsolation: true、通过 preload 脚本进行 IPC、校验所有 IPC 输入、启用 sandbox: true、发布时进行签名与公证。避免:启用 nodeIntegration、使用 remote 模块、加载不受信任内容、暴露完整 Node.js API、跳过代码签名。

备选框架

  • Tauri:更小的包体积、Rust 后端
  • Neutralino:轻量、系统 WebView
  • Electron:完整 Node.js、成熟生态

限制

资料未提供具体的安装命令、依赖版本、性能或兼容性基准数据,也未说明收费或授权信息。