Electron 的打包

Electron Forge 是 Electron apps 一体化的 打包和分发工具,及将开发好的 Electron 应用打包为可安装,可执行的文件,最终交付给终端用户的核心过程

如何打包(mac 为🌰)

  1. 安装 Electron Forge's CLI 到 devDependencies,并且使用脚本将项目导入到 Forge 中
js 复制代码
// 安装 Electron Forge's CLI 到 `devDependencies`
npm install --save-dev @electron-forge/cli

// 将项目导入到 Forge 中
npx electron-forge import

一旦将项目导入到 Forge 的脚本完成了,Forge 将会添加一些脚本到 your package.json 中

js 复制代码
//...
"scripts": {
    "start": "electron-forge start",
    "package": "electron-forge package",
    "make": "electron-forge make"
},
//...
  1. 创建分发文件
js 复制代码
// 执行这个脚本的时候将会根据当前系统来打包对应的可运行文件,
// 比如 mac 在项目的 out/make/zip/darwin/arm64/$packageName-darwin-arm64-1.0.0.zip 中
pnpm run make
  1. 打开对应的文件夹,解压 zip 文件,双击文件即可

打包的问题

  1. 打包不同的格式来适应不同的机器

答:使用 GitHub Actions / CI 生成在不同的 runner 生成不同的包,比如 Windows 的就使用 Windows 的 runner

  1. 如何自定义 icon 答:直接参考 www.electronforge.io/guides/crea... ,需要注意的是要为不同的系统准备不同的 icon 后缀,配置的时候不要指定 icon 的后缀
js 复制代码
// 比如我是将文件放到 public/images 中
public
  - images
     - icon.icns
     - icon.xxx

// forge.config.js
module.exports = {
  // ...
  packagerConfig: {
    icon: 'public/images/icon' // no file extension required
  }
  // ...
};

最终结果

  1. 怎么代码签名 代码签名是发布桌面应用程序的重要环节,并且在自动更新步骤中是必不可少的,需要去对应的系统申请不同的认证方式,macOS 的 TEAM_ID 需要钱,如有需要自行申请
相关推荐
甘晴void11 小时前
我给 Magpie 做了个 macOS 桌宠:106 段动画,请求一多就亮灯
macos·electron·开源·deepseek·桌面宠物·magpie
还好还好不是吗12 小时前
我把开源项目托管给 AI 了:一句话提需求,AI 自己开发、自己测试、自己提 PR
electron
栀椩19 小时前
Electron 内嵌页面跨域问题(CORS/PNA)解决全记录
前端·javascript·electron
不可能片场2 天前
Electron 发布 cookie 库先查明文再写解密
前端·electron
又过二十2 天前
用 Electron 做的 AI 视频切片工作台:VClip 的技术选型与踩坑实录
ai·electron·aigc·funasr·视频切片
不可能片场4 天前
工程实践 日志文件名是北京日期 内容却是 UTC
前端·electron
不可能片场8 天前
工程实践 台账备份从全量复制改成增量日志
前端·electron
林恒smileZAZ8 天前
用 Vue 3 + Electron 做桌宠:从启动退出到拖拽、单击与鼠标穿透
vue.js·electron·计算机外设
非常好吃的糖8 天前
Windows 桌面端的语音唤醒:从「识别出文字」到「识别出唤醒词」
electron
Suprman10 天前
从 B/S 到 Electron:平面排版套料系统桌面版开发实战
javascript·平面·electron·排序算法