前言
在将 Electron 代码开发完成后,如果想要投入生产环境,那就必须经过很关键的一步——打包。
今天就将 MacOS 上使用 electron-builder 打包 Electron 应用的过程做一个记录。
为什么要打包
我上一篇文章《使用 VSCode 调试 Electron 主进程代码》介绍了在开发环境下运行 Electron 程序的方法,既然可以正常运行了,那为什么还需要经过打包的步骤呢?原因如下:
- 为了实现跨平台的目的
在打包之前,如果我将源码拷贝一份到其他操作系统(比如 windows)上,那要正常运行的话,必须在对应的系统上安装适配该系统的 Electron 执行程序。
为了减小跨平台的复杂度,我们需要针对各个不同的平台,将程序代码打包成适配平台的应用程序,达到直接使用的目的。 - 为了减小代码体积
一个最基本的 Electron 程序,其开发环境代码体积大约 170MB,因为有较多开发依赖(devDependencies
),对于程序的传输极不友好。
可以通过打包的手段,排查掉众多开发依赖,精简应用代码体积。
环境
- 操作系统:
macOS Catalina 10.15.7
- Electron Version: 16.0.6
- electron-builder: 22.14.5
- 程序代码:《使用 VSCode 调试 Electron 主进程代码》中用到的
electron-quick-start
目录
打包步骤
-
安装 electron-builder
mkdir electron-builder cd electron-builder yarn init -y yarn add electron-builder -D
这里建议将 electron-builder 安装在单独的目录,方便复用。
-
添加打包指令(也可直接在终端执行)
// electron-quick-start/package.json