Electron使用HTML、CSS、JavaScript构建跨平台桌面应用，结合Chromium与Node.js，支持主渲染进程通信，通过electron-builder打包，适合前端开发者快速开发工具类应用。
Electron 让你用 HTML、CSS 和 JavaScript 构建跨平台的桌面应用，支持 Windows、macOS 和 Linux。它结合了 Chromium 渲染界面和 Node.js 提供系统底层能力，适合前端开发者快速上手桌面开发。
搭建基础项目结构
创建一个新文件夹，初始化 npm 项目：
npm init -y npm install electron --save-dev在项目根目录创建 main.js，这是 Electron 的主进程入口：
const { app, BrowserWindow } = require('electron') function createWindow () { const win = new BrowserWindow({ width: 800, height: 600, webPreferences: { nodeIntegration: false } }) win.loadFile('index.html') } app.whenReady().then(() => { createWindow() app.on('activate', () => { if (BrowserWindow.getAllWindows().length === 0) createWindow() }) }) app.on('window-all-closed', () => { if (process.platform !== 'darwin') app.quit() })再创建一个简单的 index.html 页面作为界面：
立即学习“Java免费学习笔记（深入）”；
欢迎使用 Electron
这是你的第一个桌面应用。
在 package.json 中添加启动命令：
"scripts": { "start": "electron main.js" }主进程与渲染进程通信
Electron 分为主进程（控制窗口、菜单等）和渲染进程（页面逻辑）。它们通过 ipcMain 和 ipcRenderer 通信。
例如，在渲染进程中发送消息：
const { ipcRenderer } = require('electron') ipcRenderer.send('request-data', '获取数据')在主进程中监听并响应：
const { ipcMain } = require('electron') ipcMain.on('request-data', (event, arg) => { event.reply('response-data', '这是返回的数据') })渲染进程监听回复：
ipcRenderer.on('response-data', (event, data) => { console.log(data) })
打包成可执行文件
开发完成后，使用 electron-builder 或 electron-packager 打包应用。
安装 electron-builder：
npm install electron-builder --save-dev在 package.json 添加构建配置：
"build": { "productName": "MyApp", "appId": "com.example.myapp", "win": { "target": "nsis" }, "mac": { "target": "dmg" }, "linux": { "target": "AppImage" } }, "scripts": { "dist": "electron-builder" }运行打包命令：
npm run dist输出目录会生成对应平台的安装包或可执行文件。
常见注意事项
安全方面避免启用 nodeIntegration 在不受信任的内容中，防止远程代码执行。
性能优化建议：控制窗口数量、减少主进程负担、合理使用后台进程。
调试时可用打开 DevTools 查看渲染进程，主进程可通过 VS Code 断点调试。
基本上就这些。Electron 上手快，生态成熟，适合做工具类、管理类或跨端一致的桌面应用。
