Electron打包太大如何减小安装包体积

Electron打包太大如何减小安装包体积

Electron有个缺点，就是基础体积太大，导致打包后生成的安装包体积动辄130M+，不利于分发软件。这篇教程通过一个实际项目演示如何把130M+的Electron安装包减小到30M-40M之间，压缩率高达71.6%。

如果你对Electron打包的过程不了解，可以先点击下面的链接查看我之前的教程《Electron程序如何打包成exe或msi安装文件》和《打包Electron程序为exe文件时，如何配置NSIS》。

3Electron程序如何打包成exe或msi安装文件？

2打包Electron程序为exe文件时，如何配置NSIS？

排除无用的node_modules依赖。

node_modules文件夹体积为143M，但是这里面的依赖都是开发依赖，并没有生产依赖，所以我们在打包前将其排除在外。

制作app.asar。

将排除了node_modules的业务文件通过“asar pack ./ app.asar”指令压缩成app.asar。

如果您想了解更多关于app.asar文件压缩、解压缩，编译、反编译的详情，可以点击下面的链接查看我之前写的教程《如何解压app.asar》和《如何反编译app.asar》。

7如何解压app.asar

2如何反编译app.asar

组合成完整的Electron程序。

将app.asar放在resources文件夹下，注意保留默认的electron.asar。当软件运行时，electron.exe调用app.asar文件。

如果你的Electron程序的技术栈是Electron+Vue.js，那么可以查看另外一篇姊妹教程——“electron vue 如何开发项目”。

1electron vue 如何开发项目

以管理员方式运行NSIS。

①如果没有“以管理员方式运行”NSIS，会在生成脚本后报错“Win32 Error. Code 740 请求的操作需要提升”。

②如果想一劳永逸，不想每次都麻烦这一操作，可以在“属性”→“兼容性”选项卡中勾选“以管理员身份运行此程序”。

制作.nsi脚本。

点击NSIS“新建脚本：向导”，然后按照向导一步步填写配置，最终会生成一个.nsi的脚本文件。

鉴于这一步由于技巧性比较强，需要注意的事项繁多，且容易出错，所以我写了另外一个教程——“打包Electron程序为exe文件时，如何配置NSIS？”。

2打包Electron程序为exe文件时，如何配置NSIS？

生成exe安装包文件。

点击NSIS中的“编译并运行（F9）”，即可看到生成的.exe安装包文件。

打包前，Electron程序的体积为130M，而经过我们精简打包将体积减小到36.9M，压缩率高达71.6%。