1.安装 electron-builder:
在你的 Electron 项目中,通过 npm 或 yarn 安装 electron-builder
。
npm install --save-dev electron-builder
2.配置 package.json:
在项目的 package.json
文件中,添加 electron-builder
相关的配置。这通常包括 build
字段,用于指定打包的详细信息,如目标平台、输出目录、应用程序的元数据等。
"build": {
"appId": "com.example.yourapp",
"productName": "Your App Name",
"win": {
"target": ["nsis", "zip"],
"icon": "build/icon.ico"
},
"mac": {
"category": "your.app.category.type",
"icon": "build/icon.icns"
},
"linux": {
"target": [
"AppImage",
"deb"
],
"category": "Utility",
"icon": "build/icon.png"
},
"directories": {
"output": "dist"
}
}
3.编写打包脚本(可选):
在 package.json
的 scripts
字段中,你可以添加一个脚本来执行打包操作。例如:
"scripts": {
"dist": "electron-builder"
}
4.执行打包:
直接在命令行中运行 electron-builder
命令(或使用上述定义的脚本),将会开始打包过程。
npm run dist
5.检查打包结果:
打包完成后,你可以在指定的输出目录(如上面配置的 dist
目录)中找到打包生成的文件。
注:具体可看electron-builder官方文档:https://github.com/QDMarkMan/CodeBlog/blob/master/Electron/electron-builder%E6%89%93%E5%8C%85%E8%AF%A6%E8%A7%A3.md
常见问题:
主要在于依赖问题导致打包不成功一直报错!!!
然后就是github的原因导致下载很慢超时等情况!!!
解决方案:
打包 主体依赖
electron-builder 作为一个用于 Electron 应用程序打包的工具,需要下载并使用 Electron 运行时
来创建可执行文件。
在您的应用程序中,您使用的是 Electron 的 API 和功能,并且在打包时,electron-builder 将这些文件放入一个自包含的二进制文件中。
这样可以确保应用程序在不同平台上的运行稳定性,并且与操作系统和其他应用程序之间的兼容性。
在打包过程中,electron-builder 会下载您指定的 Electron 版本,例如 electron-v12.2.3-win32-x64.zip
,然后解压缩这个 zip 包,并将其中的内容打包到您的应用程序中,使其成为一个可执行文件。这个 zip 包中包含了 Electron 运行时
所需要的所有文件,例如 Node.js、Chromium 等。
首次打包
由上所述, 第一次 执行 npm electron-builder 打包的命令时, 会到 GitHub (https://github.com/electron/electron/releases/)上下载 electron-builder 的依赖包失。
其依赖 包 有以下三个:
下载 electron-v9.0.2-win32-x64.zip 放在下面目录
C:\Users\hero\AppData\Local\electron\Cache
下载 winCodeSign-2.6.0.7z 放在下面目录
C:\Users\Administrator\AppData\Local\electron-builder\Cache\winCodeSign
nsis-3.0.4.1.7z
C:\Users\Administrator\AppData\Local\electron-builder\Cache\nsis
为了防止 github 访问不了的情况, 我把 以上的三个依赖, 都 放在了 depends 目录下了。
使用的时候,直接 将 electron.zip 解压 结果 和 electron-builder.zip 解压 结果
放到 C:\Users\hero\AppData\Local\下;
按照步骤操作执行就可以啦!!!
最后祝各位都能顺利打包成功!!!