【重磅推荐】electron+之如何成功搭建一个window桌面程序【搭建环境--转exe文件-安装-卸载】全过程总结

electron应用程序打包官方文档： https://electronjs.org/docs/tutorial/application-packaging

关于转exe的操作：这篇文章讲的还不错，可以参考：https://newsn.net/say/electron-quick-start-modify.html 

 

第一步：创建并运行项目（）：

1、下载官方第一个demo【这个比较简单】：https://github.com/electron/electron-quick-start

2、安装环境：

// 自动安装package.json下面的包
npm install

3、创建目录结构【注：electron-builder打包工具一定要在package.json的目录下运行】：

4、在package.json的目录下运行npm start即可启动项目！

 

 

第二步：打包生成exe可执行文件【绿色版】【官方提供的三个工具】

1、electron-builder用法【集成了nsis工具自动生成安装程序，自动加密源代码asar格式，并删除源代码】【推荐使用】：

// 打包成绿色版【打包成asar格式,且不会暴露app源代码--自动删除了】
electron-builder --dir

// 打包成安装程序
electron-builder 

// 更多参数
electron-builder --help

electron-builder官方文档：https://github.com/electron-userland/electron-builder

 

 

2、electron-packager 用法（常见用法-windows打包-默认值）：

electron-packager ./ electronApp --out=dist


// 更多参数参考
electron-packager --help

electron-packager更多参数参考官方文档：

https://github.com/electron-userland/electron-packager

https://github.com/electron-userland/electron-packager/blob/master/usage.txt

 

3、electron-forge【生成的exe绿色版不会加密源代码成asar格式】【常用打包命令】

安装注意：npm i @electron-forge/cli【一定要安装cli,否则无效】 

npx electron-forge package 

更多参数
npx electron-forge --help

更多参数：

官方文档：https://github.com/electron-userland/electron-forge

官网：https://v6.electronforge.io/cli

 

第三步：源代码加密成asar格式【一定要加密，不然我们打源代码会暴露】

注：如果使用electron-builder工具打包，已经给你加密了app.asar文件，且删除了源代码【推荐使用】

如果使用electron-packager 或 electron-forge 你就要去：输出路径/electronApp-win32-x64/resources/app目录下删除app源代码，并把asar打包的app.asar文件复制过去，启动运行即可！

【非常重要】千万别去打包node_modules文件夹，否则你的app.asar会很大【虽然程序也一样可以正常执行！】

// 局部安装asar
npm install asar --save-dev


// 在你的package.json同级目录下运行命令【仅打包源代码--node_modules不要打包了，太大】：
npx asar pack ./app app.asar


// 查看打包后的文件目录结构
npx asar list app.asar

 

第三步：Windows使用nsis自定义安装程序【标准安装、卸载】

nsis打包electron的详细步骤参考：

nsis中文版下载：http://www.ouyaoxiazai.com/soft/hyrj/146/15257.html

【带视频】https://jingyan.baidu.com/article/870c6fc361aad5b03fe4bea8.html

【图片很详细】https://blog.csdn.net/ddjj_1980/article/details/7843944

【nsis打包务必注意这一步：如果错了，你的程序是打不开的，因为文件不全】