Electron 应用打包与分发：从开发到交付的完整指南

Electron 是一个强大的框架，允许开发者使用 JavaScript、HTML 和 CSS 构建跨平台的桌面应用程序。然而，开发完成后，如何将应用打包并分发给用户，仍然是一个关键问题。不同的操作系统（Windows、macOS、Linux）有不同的打包格式和分发方式，同时还需要考虑自动更新、代码签名等问题。

1. 常用的打包工具

(1) electron-packager

electron-packager 是一个简单易用的打包工具，可以将 Electron 应用打包成各平台的可执行文件。

安装

npm install electron-packager --save-dev

基本用法

npx electron-packager . MyApp --platform=win32 --arch=x64 --out=dist/

常用参数

优点

• 简单易用，适合快速打包

• 支持多平台、多架构

缺点

• 不直接支持安装包（如 .msi、.dmg）

• 需要额外工具（如 NSIS）制作安装程序

(2) electron-builder

electron-builder 是一个更强大的打包工具，支持自动更新、安装包生成和代码签名。

安装

npm install electron-builder --save-dev

配置（package.json 示例）

{
  "build": {
    "appId": "com.example.myapp",
    "win": {
      "target": "nsis",
      "icon": "build/icon.ico"
    },
    "mac": {
      "target": "dmg",
      "icon": "build/icon.icns"
    },
    "linux": {
      "target": "AppImage",
      "icon": "build/icon.png"
    }
  }
}

打包命令

npx electron-builder --win  # 打包 Windows 版本
npx electron-builder --mac  # 打包 macOS 版本
npx electron-builder --linux  # 打包 Linux 版本

优点

• 支持自动更新

• 可直接生成安装包（.exe、.dmg、.AppImage）

• 内置代码签名支持

缺点

• 配置较复杂

• 需要额外设置自动更新服务器

2. 不同平台的分发格式

(1) Windows

推荐工具

• electron-builder（默认支持 NSIS 和 MSI）

• WiX Toolset（用于高级 MSI 打包）

(2) macOS

推荐工具

• electron-builder（默认支持 .dmg）

• create-dmg（用于自定义 .dmg 打包）

(3) Linux

推荐工具

• electron-builder（支持 AppImage、deb、rpm）

• snapcraft（用于 snap 打包）

3. 自动更新机制

Electron 应用可以通过以下方式实现自动更新：

(1) electron-updater（electron-builder 内置）

const { autoUpdater } = require('electron-updater');

autoUpdater.on('update-available', () => {
  // 通知用户有更新可用
});

autoUpdater.on('update-downloaded', () => {
  // 提示用户重启应用以完成更新
});

// 检查更新
autoUpdater.checkForUpdatesAndNotify();

(2) 使用 GitHub Releases

{
  "build": {
    "publish": {
      "provider": "github",
      "owner": "your-github-username",
      "repo": "your-repo-name"
    }
  }
}

(3) 第三方服务

• Electron Forge（提供完整的发布流程）

• Update.electronjs.org（官方自动更新服务）

4. 代码签名（确保应用安全）

未经签名的应用可能会被操作系统拦截，因此建议对所有分发版本进行代码签名。

签名工具

• Windows: signtool（Visual Studio 自带）

• macOS: codesign

• Linux: 通常不需要

5. 最佳实践

1. 保持 Electron 更新

   定期升级 Electron 版本，避免安全漏洞。

2. 最小化打包

   使用 .asar 打包主进程代码，减少文件数量。

3. 测试多平台

   在 Windows、macOS 和 Linux 上测试打包结果。

4. 提供多种分发格式

   例如 Windows 提供 .exe 和 .msi，macOS 提供 .dmg 和 .pkg。

5. 设置自动更新

   让用户可以无缝升级到最新版本。

6. 优化安装体验

   提供清晰的安装向导，避免用户困惑。

总结

Electron 应用的打包与分发涉及多个步骤：

1. 选择合适的打包工具（electron-packager 或 electron-builder）

2. 生成目标平台的安装包（Windows .exe/.msi，macOS .dmg，Linux .AppImage）

3. 实现自动更新（electron-updater 或 GitHub Releases）

4. 进行代码签名（确保应用不被拦截）

5. 遵循最佳实践（优化打包流程）

通过合理的打包策略，可以让 Electron 应用更容易被用户接受，并提供良好的使用体验。希望本文能帮助你顺利完成 Electron 应用的打包与分发！