electron-builder打包配置 + electron-updater应用更新完整教程And踩坑总结

最新推荐文章于 2025-05-21 11:31:27 发布

TreasureÂ°

最新推荐文章于 2025-05-21 11:31:27 发布

阅读量5.4k

点赞数 2

CC 4.0 BY-SA版权

分类专栏： electron electron-builder electron-updater 文章标签： vue.js 经验分享

本文链接：https://blog.csdn.net/weixin_43582313/article/details/106733270

本文详述了使用electron-builder进行 Electron 应用打包的步骤，包括安装配置、解决连接超时问题，以及设置淘宝镜像。同时，介绍了electron-updater的安装和使用，确保应用能够自动检查并更新到最新版本。通过在main.js中配置更新逻辑，实现了应用的无缝升级。最后，分享了解决打包过程中遇到的问题和经验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

electron打包以及应用自动更新

一.electron-builder
- 1.electron-builder安装及配置
- 2.electron-builder打包时遇到的问题及解决
二. electron-updater

一.electron-builder

1.electron-builder安装及配置

安装命令：yarn add electron-builder --dev 或 npm install electron-builder --dev
(PS: 官方推荐使用yarn安装，说是能更好的处理依赖之间的关系)

安装好之后，配置package.json文件:

"build": {
   
   
    "appId": "com.xx.xx", // appid，‘com.xxx.xxx’格式
    "productName": "appname", // 应用的名称
    "directories": {
   
   
      "output": "dist" // 打包存在哪个文件夹，这么写的话打包好的exe就会生成在dist中
    },
    "publish": [ // 配合electron-updater来用
      {
   
   
        "provider": "generic", // 服务器供应商
        "url": "http://oss.poooli.com/download/app/desktop/" //服务器地址
      }
    ],
    "files": [
      "src/resources" // 在这里可以自定义打包文件
    ],
    "nsis": {
   
   
      "oneClick": false,
      "allowElevation": true,
      "allowToChangeInstallationDirectory": true,
      "installerIcon": "src/resources/icons/icon.ico",
      "uninstallerIcon": "src/resources/icons/icon.ico",
      "installerHeaderIcon": "src/resources/icons/icon.ico",
      "createDesktopShortcut": true,
      "createStartMenuShortcut": true,
      "shortcutName": "name"
    },
    "dmg": {
   
   
      "contents": [
        {
   
   
          "x": 410,
          "y": 150,
          "type": "link",
          "path": "/Applications"
        },
        {
   
   
          "x": 130,
          "y": 150,
          "type": "file"
        }
      ]
    },
    "mac": {
   
   
      "icon": "src/resources/icons/icon.icns"