electron vue 自动下载更新版本

1、检查版本号，是否过低（小于3需要更新）

2、更新electron版本

（不行可以尝试直接删除module，重新安装）

1.卸载electron

npm uninstall electron

2.重新安装最新版本(安装指定版本使用 @版本号 )

npm install electron --save-dev

如图当前最新版本：

3、安装一下更新插件

npm install electron-updater --save

4、需要安装的安装完毕，下面进行配置：

需要新建一个js，用来检测版本更新

 const { ipcMain } = require('electron')
 const { autoUpdater } = require("electron-updater")
 const { build } = require("../../../package.json")

  
 // 用户反馈立即更新
 ipcMain.on('ev-update-now', () => {
     console.log('ev-update-now::: 用户同意更新，开始更新') 
  
     autoUpdater.quitAndInstall()
 })
  
 // 用户也可以通过点击按钮去检测更新
 ipcMain.on('ev-check-for-update', () => {
     console.log('ev-check-for-update::: 执行自动更新检查') 
  
     autoUpdater.checkForUpdates()
 })
  
 function handleUpdate(mainWindow) {
     const message = {
         error: '检查更新出错',
         checking: '正在检查更新……',
         updateAva: '检测到新版本，正在下载……',
         updateNotAva: '现在使用的就是最新版本，不用更新'
     }
  
     autoUpdater.setFeedURL(build.publish[0].url) // 设置下载地址
  
     // 检查更新出错
     autoUpdater.on('error', () => {
         console.log('autoUpdater-error:::', arguments)
  
         sendUpdateMessage(message.error)
     })
  
     // 检查是否有版本更新
     autoUpdater.on('checking-for-update', () => {
         console.log('checking-for-update:::', arguments)
  
         sendUpdateMessage(message.checking)
     })
  
     // 检测到有版本更新
     autoUpdater.on('update-available', () => {
         console.log('update-available:::', arguments)
  
         sendUpdateMessage(message.updateAva)
     })
  
     // 未发现有新版本
     autoUpdater.on('update-not-available', () => {
         console.log('update-not-available:::', arguments)
  
         sendUpdateMessage(message.updateNotAva)
     })
  
     // 更新下载进度事件
     autoUpdater.on('download-progress', progressObj => {
         console.log('download-progress:::', progressObj)
         
         mainWindow.setProgressBar(progressObj.percent / 100)
     })
  
     // 下载完成，询问用户是否更新
     autoUpdater.on('update-downloaded', (event, releaseNotes, releaseName, releaseDate, updateUrl, quitAndUpdate) => {
         console.log('update-downloaded::: 下载完成，询问用户是否更新') 
         
         mainWindow.webContents.send('ev-should-update', {
             event,
             releaseNotes,
             releaseName,
             releaseDate,
             updateUrl,
             quitAndUpdate
         })
     })
  
     function sendUpdateMessage(text) {
         mainWindow.webContents.send('ev-message', text)
     }
 }
  
 module.exports = {
     handleUpdate
 }

5、主进程中进入上面的update.js

头部引入

const { handleUpdate } = require('../renderer/utils/update')//根据自己路径引入

使用：

该地方使用

  mainWindow.on('closed', () => {
    mainWindow = null
  })

  //自动更新函数
  handleUpdate(mainWindow) // 在这里执行，并把mainWindow传入

6、启动

如果报错空白，需要在主进程的js里面添加如下代码（main/index.js）

nodeIntegration:true

7、打包上传

执行打包命令本地打包

npm run build

打包完成后，需要将以下两个文件上传到服务器

服务器端访问效果：

（需要配置一个文件访问目录，可以参考我另一篇：https://blog.csdn.net/xingsfdz/article/details/113839400），配置完后，访问效果如下：

8、结果说明

当机器上运行的版本低于第8点服务器上面的版本的时候，会自动下载安装更新！

效果如下：