Electron API 速查与配置模板

主进程 API 速查表

模块 功能描述 常用方法 说明
app 控制应用生命周期 app.on('ready')、app.quit()、app.getPath('userData') 管理应用启动、退出、路径、协议注册等
BrowserWindow 创建与管理窗口 new BrowserWindow(options)、win.loadFile()、win.loadURL()、win.webContents Electron 应用的主要 UI 容器，内部运行渲染进程
ipcMain 主进程通信接口 ipcMain.on(channel, callback)、ipcMain.handle(channel, handler) 监听渲染进程发来的消息或调用请求
Menu 创建应用菜单 Menu.buildFromTemplate(menuTemplate)、Menu.setApplicationMenu(menu) 可自定义菜单项、快捷键、右键菜单
Tray 系统托盘管理 new Tray(icon)、tray.setToolTip()、tray.setContextMenu(menu) 在任务栏显示图标，常用于后台常驻应用
Dialog 系统原生对话框 dialog.showOpenDialog()、dialog.showSaveDialog()、dialog.showMessageBox() 文件选择、保存、消息提示等系统交互
Notification 系统通知 new Notification({ title, body }).show() 发送系统原生通知，可带点击回调
Shell 调用系统外部资源 shell.openExternal(url)、shell.showItemInFolder(path) 打开外部网页、文件夹、执行文件
Protocol 注册自定义协议 protocol.registerFileProtocol()、protocol.handle() 用于自定义资源加载或深度链接
Session 管理会话、缓存、Cookie session.defaultSession.cookies.get()、clearCache() 对浏览数据和请求做底层控制
Net 原生 HTTP/HTTPS 网络请求 net.request(options) 更底层的网络模块，性能优于 fetch
PowerMonitor 监控系统电源状态 powerMonitor.on('suspend')、on('resume') 监听电脑睡眠、唤醒、锁屏等状态
Clipboard 剪贴板操作 clipboard.readText()、clipboard.writeText() 支持跨平台复制粘贴文本、图片等
GlobalShortcut 注册全局快捷键 globalShortcut.register('CommandOrControl+X', fn) 跨窗口、后台生效的快捷键

渲染进程 API 速查表

模块 功能描述 常用方法 说明
ipcRenderer 与主进程通信 ipcRenderer.send()、ipcRenderer.invoke()、ipcRenderer.on() 用于渲染进程发送、接收、调用主进程事件
webFrame 控制当前页面内容 webFrame.setZoomFactor()、webFrame.insertCSS() 动态修改页面缩放、样式
contextBridge 安全暴露 API contextBridge.exposeInMainWorld('api', {...}) 在启用 contextIsolation 时安全地与主进程交互
desktopCapturer 捕获屏幕内容 desktopCapturer.getSources({ types: ['window', 'screen'] }) 用于截图或屏幕录制功能
Notification 通知 API new Notification('标题', { body: '内容' }) 使用浏览器标准 Notification 发送通知
Clipboard 剪贴板操作 navigator.clipboard.readText() 可访问系统剪贴板（部分功能受限制）
Web Storage / IndexedDB 本地存储 localStorage.setItem()、indexedDB.open() 保存轻量或结构化数据
Fetch / Axios 网络请求 fetch(url)、axios.get() 用于访问远程接口、加载资源
DOM / Window 页面控制 document.querySelector()、window.open() 所有 Web API 均可使用

常用辅助模块速查表

模块 主要功能 示例
fs 文件操作 fs.readFileSync(path)、fs.writeFile(path, data)
path 路径拼接 path.join(__dirname, 'index.html')
os 系统信息 os.platform()、os.homedir()
child_process 执行子进程 exec('ls', callback)
electron-store 持久化配置 store.set('key', value)、store.get('key')
sqlite3 / better-sqlite3 本地数据库 db.prepare('SELECT * FROM notes').all()
axios / node-fetch 网络请求 axios.post(url, data)
node-gyp 原生模块编译 node-gyp rebuild

配置文件模板与说明

package.json 模板与说明

{
  "name": "my-electron-app",
  "version": "1.0.0",
  "description": "示例 Electron 应用",
  "main": "main.js",
  "scripts": {
    "start": "electron .",
    "pack": "electron-builder --dir",
    "dist": "electron-builder"
  },
  "devDependencies": {
    "electron": "^33.0.0",
    "electron-builder": "^24.6.0"
  },
  "build": {
    "appId": "com.example.myelectronapp",
    "productName": "MyElectronApp",
    "directories": {
      "output": "dist"
    },
    "files": [
      "main.js",
      "preload.js",
      "renderer/**/*"
    ],
    "win": {
      "target": "nsis",
      "icon": "assets/icon.ico"
    },
    "mac": {
      "category": "public.app-category.productivity",
      "icon": "assets/icon.icns"
    },
    "linux": {
      "target": "AppImage",
      "icon": "assets/"
    }
  }
}

说明：

字段 含义
name / version / description 应用名称、版本号与描述信息
main 主进程入口文件（必须）
scripts 定义命令脚本，npm start 启动，npm run dist 打包
devDependencies 开发依赖（Electron、打包工具等）
build electron-builder 的配置项
appId 应用唯一 ID，用于签名和更新识别
productName 打包后显示的应用名称
directories.output 打包输出路径
files 指定要打包进应用的文件和目录
win/mac/linux 各平台独立打包配置（图标、目标格式）

electron-builder.yml 模板与说明

appId: com.example.myelectronapp
productName: MyElectronApp
directories:
  output: dist
files:
  - "main.js"
  - "preload.js"
  - "renderer/**/*"
win:
  target: nsis
  icon: assets/icon.ico
mac:
  target: dmg
  icon: assets/icon.icns
linux:
  target: AppImage
  icon: assets/
publish:
  provider: github
  repo: my-electron-app
  owner: username

说明：

配置项 说明
appId / productName 应用唯一标识与名称
directories.output 打包输出目录
files 打包文件列表（支持通配符）
win / mac / linux 不同系统的构建目标与图标配置
publish 自动更新时的发布源配置（如 GitHub Releases）

TypeScript tsconfig.json 模板与说明

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "commonjs",
    "strict": true,
    "outDir": "./dist",
    "rootDir": "./src",
    "esModuleInterop": true,
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "skipLibCheck": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

说明：

选项 含义
target 编译目标 JavaScript 版本
module 模块系统，Electron 主进程一般使用 commonjs
outDir / rootDir 输出与源码目录
strict 启用严格类型检查
esModuleInterop 允许默认导入非 ES 模块
resolveJsonModule 支持导入 JSON 文件
skipLibCheck 跳过声明文件检查，加快编译速度