electron+vue-cli4使用electron-updater自动更新

一.软件版本

当前 vue: 4.4.6
项目依赖包,package.json

  "devDependencies": {
    "electron": "^3.0.0",
    "vue-cli-plugin-electron-builder": "^1.3.6",
    "electron-log": "^3.0.7",
    "electron-store": "^2.0.0",
    "electron-updater": "^4.1.2"
  },

二.自动更新配置

在background.js引入加入相关代码

import {autoUpdater} from "electron-updater"
import { ipcMain} from 'electron'

//监听相关事件
autoUpdater.on('checking-for-update', () => {
    sendStatusToWindow('Checking for update...');
})
autoUpdater.on('update-available', (ev, info) => {
    sendStatusToWindow('Update available.');
})
autoUpdater.on('update-not-available', (ev, info) => {
    sendStatusToWindow('Update not available.');
})
autoUpdater.on('error', (ev, err) => {
    sendStatusToWindow('Error in auto-updater.');
})
autoUpdater.on('download-progress', (ev, progressObj) => {
    sendStatusToWindow('Download progress...');
})
autoUpdater.on('update-downloaded', (ev, info) => {
    sendStatusToWindow('Update downloaded; will install in 5 seconds');
});
//发送消息到窗体
function sendStatusToWindow(text) {
    win.webContents.send('message', text);
}

//初始化完成,窗口创建完成后开始检查更新
app.on('ready', function () {
    autoUpdater.checkForUpdates();
});

//下载完成监听,处理事件
autoUpdater.on('update-downloaded', (ev, info) => {
    // Wait 5 seconds, then quit and install
    // In your application, you don't need to wait 5 seconds.
    // You could call autoUpdater.quitAndInstall(); immediately
    setTimeout(function () {
        win.focus(); // 弹窗置顶设置
        dialog.showMessageBox(win,{
            type: 'info',
            title: '自动升级',
            message: '检测到有新版本,是否立即升级?',
            buttons: ['下次升级','立即升级']
        },(index)=>{
            if(index===1){
                autoUpdater.quitAndInstall();
            }
        })
    }, 1000)
})
相关配置

在配置文件vue.config.js里面加入

pluginOptions: {
    electronBuilder: {
      builderOptions: {
        win: {
          icon: './build/icons/icon.ico',
          target: [
            {
              target: "nsis",//利用nsis制作安装程序
              arch: [
                "x64",//64位
                "ia32"//32位
              ]
            }
          ]
        },
        nsis: {
          "oneClick": false, // 是否一键安装
          "allowElevation": true, // 允许请求提升。 如果为false,则用户必须使用提升的权限重新启动安装程序。
          "allowToChangeInstallationDirectory": true, // 允许修改安装目录
          "installerIcon": "./build/icons/icon.ico",// 安装图标
          "uninstallerIcon": "./build/icons/icon.ico",//卸载图标
          "installerHeaderIcon": "./build/icons/icon.ico", // 安装时头部图标
          "createDesktopShortcut": true, // 创建桌面图标
          "createStartMenuShortcut": true,// 创建开始菜单图标
          "shortcutName": "test System", // 图标名称
        },
        mac: {
          icon: './public/favicon.png'
        },
        publish: [
          {
            provider: "generic",
            url: "http://192.0.xx.xx:8080/",//隐藏版本服务器地址
          }
        ],
        productName: 'testDemo'
      }
    }
  }

你可能感兴趣的:(#,electron-vue)