常用Electron App打包工具

electron-banner

引言

在打包Electron App的时候，有很多工具可以使用，各有长短，这里简单汇总几个常用工具的特点及注意事项，便于选择。包括：

• electron-packager；
• electron-builder；
• grunt-electron-installer（windows-installer）；

注意：详细的安装及使用方法需要参考官方文档，本文不做赘述。

electron-packager

官方链接

• GitHub

是什么

Package your Electron app into OS-specific bundles (.app, .exe, etc.) via JavaScript or the command line.
Electron Packager is a command line tool and Node.js library that bundles Electron-based application source code with a renamed Electron executable and supporting files into folders ready for distribution.

使用方法

该工具提供了两种使用方式：JS API（Node.js library）和CLI。详细使用方法请访问官方文档。下面是在命令行中使用的例子：

"scripts": {
    "package": "electron-packager . --platform=win32 --arch=ia32 --electron-version=1.4.15 --overwrite --ignore=node_modules --ignore=.gitignore"
},

特点

• 使用 electron-packager 打包，macOS系统打包app文件，不能打包exe文件，windows系统可以打包app文件以及exe文件；
• 支持平台有：Windows (32/64 bit)、OS X (also known as macOS)、Linux (x86/x86_64)；
• 生成的格式：.exe（这里不能生成安装包，只能生成可执行文件及目录）、.app、mas、linux可执行格式；
• 可选项；
• 支持CLI和JS API两种使用方式；

electron-builder

官方连接

• GitHhub

是什么

A complete solution to package and build a ready for distribution Electron app for macOS, Windows and Linux with “auto update” support out of the box.

使用方法

在 package.json中添加如下配置：

"scripts": {
    "pack": "build --win --ia32 --dir",
    "dist": "build --win --ia32"
},
"build": {
    "appId": "org.shennongmin.QuickStart",
    "copyright": "Open Totally",
    "compression": "normal",
    "nsis": {
        "oneClick": true,
        "perMachine": true,
        "runAfterFinish": true
    }
},

特点

• electron-builder 可以打包成msi、exe、dmg文件，macOS系统，只能打包dmg文件，window系统才能打包exe，msi文件；
• 几乎支持了所有平台的所有格式；
• 可以将prepackage目录（手动或使用electron-packager生成的目录）打包成安装包；
• 支持Auto Update；
• 非常丰富的选项；
• 支持CLI和JS API两种使用方式；

grunt-electron-installer

官方链接

https://github.com/electron-archive/grunt-electron-installer

是什么

Grunt plugin that builds Windows installers for Electron apps using Squirrel.

使用方法

先用 electron-packager 将应用打包到应用目录下，例如：SNM Quick Start-win32-ia32。

在应用目录下新文件 gruntPackage.json，内容如下：

{
    "name": "SNM_Quick_Start",
    "version": "1.7.8"
}

在应用目录下新文件 Gruntfile.js，内容如下：

var grunt = require("grunt");
grunt.config.init({
        pkg: grunt.file.readJSON('gruntPackage.json'),
        'create-windows-installer': {
                ia32: {
                        appDirectory: 'SNM Quick Start-win32-ia32',
                        authors: 'shen nongmin',
                        exe: 'SNM Quick Start.exe',
                        description: "this is a test",
                }       
        }
})

grunt.loadNpmTasks('grunt-electron-installer');
grunt.registerTask('default', ['create-windows-installer']);

安装grunt和grunt-electron-installer：

npm install -g grunt-cli
npm install grunt grunt-electron-installer --save-dev

在应用目录下执行grunt：

grunt

随后会在生成的installer目录中包含如下几个文件：

RELEASES
SNM Quick StartSetup.exe
SNM Quick StartSetup.msi
SNMQuickStart-1.7.8-full.nupkg

其中，.exe可以安装（如需支持Squirrel则需要对main.js进行修改，这里不介绍）。

特点

• 只支持Windows系统；
• 支持Squirrel；
• 只支持命令行使用；
• 依赖windows-installer；
• 可选项；

关于支持Squirrel的链接

• http://electron.atom.io/docs/api/auto-updater/
• https://github.com/electron/windows-installer#handling-squirrel-events
• https://github.com/mongodb-js/electron-squirrel-startup

阅读原文 | 作者官网 | 公众号 | Feed | 订阅 | 发私信