深入浅出Electron:原理、工程与实践
上QQ阅读APP看书,第一时间看更新

3.1 使用方法

应用程序的业务逻辑代码开发完成之后,就需要考虑把应用程序打包成安装文件分发给最终用户,业界最常用的两个Electron打包工具是electron-builder(https://www.electron.build/)和electron-packager(https://github.com/electron/electron-packager),这两个工具可以说都是师出名门。electron-builder是electron-userland组织下的项目,electron-packager是electron组织下的项目,有几个核心开发者同时为这两个项目贡献代码。

相对来说electron-builder比electron-packager功能更多,比如更简便易用的应用程序自动升级功能electron-packager就没有提供,但electron-builder有更多的问题且更新没有electron-packager频繁,综合来说electron-builder常用的功能都比较稳定,所以本书以electron-builder为主分析Electron应用的打包过程。

开发者可以使用如下指令安装electron-builder库到你的开发环境:

> npm install electron-builder --D

electron-builder安装完成后,你就可以为工程添加相应的配置了,这些配置可以写在工程的package.json文件中,也可以写在一个独立的配置文件中,我们以在工程的package.json文件中进行配置来介绍electron-builder的使用。

为package.json增加一个build配置节,内容如下:

"build": {
  "appId": "com.example.app"
  "productName": "yourAppName",
  "asar": true,
  "directories":{
    output: "./release",
    app: "./release/bundled",
  }
}

上面几个配置中appId为应用程序的ID,productName为应用程序的名称,asar为是否使用asar技术打包应用程序资源,directories.output为打包完成后安装包的输出目录,directories.app为待打包的资源目录(也就是我们的静态文件HTML、CSS、JavaScript所在的目录),还有非常多的其他配置可以参见官方文档https://www.electron.build/configuration/configuration

在package.json中设置好electron-builder的配置信息后,再在scripts配置节下增加如下配置:

"scripts": {
  "release": "electron-builder --win --ia32",
}

接着在当前工程目录下执行npm run release命令即可完成打包工作,最终安装包会在directories.output指定的目录下生成,上面的命令中参数--win --ia32的意义是生成Windows平台下32位的安装包。