Electron-制做程序安装包

目标

  1. 了解如何把编写的程序封装成可执行程序git

  2. 了解安装包的原理以及生成方法github

  3. 了解程序迭代升级的流程以及接入方法npm

程序封装

当应用开发完成后,为了方便使用者的运行,咱们须要把源码封装成一个可运行的程序json

第一步,了解概念

asar

从 Electron 的官方文档能够了解到 asar 是一种将多个文件合并成一个文件的类 tar 风格的归档格式。 Electron 能够无需解压整个文件,便可从其中读取任意文件内容。bash

咱们的目标是,将编写好的源码封装成一个 .asar 的文件,可让 Electron 直接运行。app

第二步,安装工具

全局安装 asar 命令行工具框架

npm install -g asar
复制代码

第三步,经过 asar 命令生成 .asar 文件

假设咱们的源码所在目录为 /projects/electron-app, 在目录 /projects 下,执行以下命令electron

asar pack ./electron-app app.asar
复制代码

顺利完成后,咱们能够在当前目录下获得 app.asar文件grunt

第四步,验证 asar 文件是否可用

这一步骤主要是为了向各位看官解释为何要生成 asar 文件工具

Electron 应用下会有一个文件夹 名为 Resources,把生成的 app.asar 文件拷贝到该目录下,再双击打开 Electron 应用,Electron 则会自动运行 app.asar 里面的内容。

Windows 系统下,能够直接在 Electron 应用的目录下找到 Resources 文件夹,mac 系统下,咱们只能看到 Electron 应用目录下只有一个 Electron.app 图标,不要着急,右击 Electron.app,选择 “显示包内容”,便可看到 Resource 文件夹

5c1c92c4c6632

5c1c9306b87e1

5c1c93431226e

总结

至此不难想象,其实咱们已经能够得到了能够发布给其余人直接运行的应用了。

若是想修改应用图标名称,修改 **Electron 执行文件(Electron.exe 或者 Electron.app)**的 名称 和 图标便可。

咱们只须要把上述的 Electron.app(Windows的话,是Electron应用目录下的全部内容) 打包成一个压缩包,便可发给使用者,使用者解压完压缩包后,直接运行里面的 Electron.app 或者 Electron.exe 便可。

以上就是 Electron 应用封装的基础原理,不管是何种方式的程序封装或者安装包打包方案,都离不开上述的过程与原理,都是针对 压缩、解压 等流程的高度化封装 与 自动化运行。

生成安装包

截至 2018-12-21, 流行的安装包生成有以下几种:

  1. NSIS

  2. electron-packager

  3. electron-builder

  4. grunt-electron-installer

解释

  1. NSIS 与 grunt-electron-installer 只能打包出 Windows 平台下的安装包, NSIS 能够对安装包的流程,安装界面高度定制化;grunt-electron-installer 打包出来的可执行文件,双击打开后直接安装 并 生成快捷方式

  2. electron-packager 支持输出多个平台(Linux、mac、Windows)的可执行文件,能够理解为 “程序封装” 步骤的自动化工具,严格意义上并非输出安装包

  3. electron-builder 几乎支持全部平台全部格式(Docker也支持),针对macOS系统,能够打包出 .dmg 安装文件,针对 Windows系统,能够打包出 .exe 或者 .msi 安装文件。能够生成 双击自动安装 并 建立程序运行入口 的安装应用,也能够生成基于 NSIS 的定制化安装过程的安装应用。

推荐方案

electron-builder

缘由:electron-builder 已经提供了很是成熟的打包方案,面向各个平台,各类格式,同时也很是容易上手。

举例:

  1. 准备好源码

    5c2080bebf110

  2. 在 package.json 准备好打包配置

    5c20837b92b60

    解释:

    "build":electron-builder 使用的配置信息;

    "dependencies.ref":项目引用的原生模块,在被打包的时候,会被自动从新编译,ref 模块在 main.js 中被引入,若是编译失败,在运行时会失败;

    "directories.output":打包完成后,输出目录;

    "buildVersion":应用对应的版本信息,该信息会被整合到安装包中去;

    "electronVersion":目标 electron 版本;

  3. 运行命令进行打包

    5c2085aa56740

    5c208604b8ed5

    解释:

    在 package.json 的 script 中准备好打包命令,参数 --mac 意味着目标平台是 macOS,参数 --64 意味着目标版本是64位应用

    在图中能够看到,咱们在 build 配置中设置了目标 electron 版本为 3.0.13,electron-builder 自动下载 electron-3.0.13 版本,并自动按照目标版本自动编译了原生模块 ref

  4. 检查打包输出

    5c208883955a2

    5c2088f019109

    解释:

    打包自动输出到当前目录的 build 目录下,默认输出了 .zip、.dmg 和 直接可运行的 .app 文件;

    双击打开 mac 目录下的 electron-quick-start.app,顺利打开应用,同时,Electron 的版本为 3.0.13;

总结

推荐直接使用 electron-builder 工具,若是目标系统是 Windows 且须要高度定制化安装流程以及安装界面,能够考虑使用 自定义 NSIS 或者 使用 electron-builder 工具自带的 NSIS 方案。

electron-builder 工具文档 很是详尽,看官们能够依照 electron-builder 的官方教程 和 本身的实际须要,快速生成安装包和应用。

额外补充一点,不管是哪种安装包生成方案,都离不开应用封装的原理,看官们若是感兴趣的话,能够尝试基于 Electron 框架,编写一个高度定制的安装程序,安装程序 再 进行其余应用的安装。

关于升级

Electron 官方提供了 自动升级的检查与运行机制,参考文档:Electron AutoUpdate

Electron 官方与第三方已经提供了不少不一样的方案进行升级(具体方案不进行详述),各位看官能够根据本身的需求选择合适的方案实现升级。若是现成的方案都不能知足需求,看官们在已经了解了 应用封装的原理后,彻底能够本身实现一套应用更新的机制。

注意点

  1. Don’t expect that you can build app for all platforms on one platform. -- 不要尝试在一个平台上,为不一样的平台生成安装包或者应用,目前来讲这不可行

  2. asar 限制:有一些特性,在源码上能够正常工做,可是当源码打包成 asar 后,则不能正常工做。这些限制须要提早留意,详情查看 Electron 官方文档

相关文章
相关标签/搜索