开发客户端要做的就是自动更新模块，不然每次版本升级都头疼。下面是Electron应用使用electron-builder和electron-updater实现自动更新的方案。1、安装electron-updater包模块npminstallelectron-updater--save2。配置package.json文件2.1为了在打包时生成latest.yml文件，需要在build参数中加入publish配置。"build":{"productName":"***",//隐藏软件名称"appId":"**",//隐藏appid"directories":{"output":"build"},"publish":[{"provider":"generic","url":"http://**.**.**.**:3002/download/",//更新服务器地址，可以为空}],"文件":["dist/electron/**/*"],"dmg":{"内容":[{"x":410,"y":150,"类型":"链接",“路径”：“/应用程序”}，{“x”：130，“y”：150，“类型”：“文件”}]}，“mac”：{“图标”：“构建/图标/图标。icns","artifactName":"${productName}_setup_${version}.${ext}"},"win":{"icon":"build/icons/icon.ico","artifactName":"${productName}_setup_${version}.${ext}"},"linux":{"icon":"build/icons","artifactName":"${productName}_setup_${version}.${ext}"}}注意：配置发布后才会生成latest.yml文件，用于自动更新配置信息；latest.yml文件是打包过程中生成的文件。为了避免自动更新出错，打包之后禁止对latest.yml文件做任何修改。如果文件有误，必须重新打包得到一个新的latest.yml文件！！！2.2添加nsis配置（可省略）nsis配置不会影响自动更新功能，但可以优化用户体验，比如是否允许用户自定义安装位置，是否添加桌面快捷方式，安装后是否立即启动，配置安装图标等。在构建参数中也添加了nsis配置。详细的参数配置可以参考官方文档nsis配置。"nsis":{"oneClick":true,"perMachine":true,"allowElevation":true,"allowToChangeInstallationDirectory":true,"createDesktopShortcut":true,"runAfterFinish":true,"installerIcon":"./build/icon.ico","uninstallerIcon":"./build/icon.ico"},3.配置主进程main.js文件（或主进程main中的index.js文件），导入electron-updater文件,添加自动更新检测和事件监听：注意：必须是主进程main.js文件（或主进程main中的index.js文件），否则会报错。注意：这个autoUpdater不是electron中的autoUpdater，而是electron-updater的autoUpdater，否则不讨论！import{app,BrowserWindow,ipcMain}from'electron'//注意这个autoUpdater不是electron中的autoUpdaterimport{autoUpdater}from"electron-updater"//更新服务器地址，比如"http://**.**.**.**:3002/download/"import{uploadUrl}from"../renderer/config/config";//检查更新，想检查更新的时候执行，把函数写在renderer事件触发updateHandle(){letmessage={error:'检查更新时出错',checking:'正在检查更新...',updateAva:'检测到新版本，正在下载...',updateNotAva:'最新版本版本正在使用中，请勿更新',};constos=require('os');autoUpdater.setFeedURL(uploadUrl);autoUpdater.on('error',function(error){sendUpdateMessage(message.error)});autoUpdater.on('检查更新',function(){sendUpdateMessage(message.checking)});autoUpdater.on('update-available',function(info){sendUpdateMessage(message.updateAva)});autoUpdater.on('update-not-available',function(info){sendUpdateMessage(message.updateNotAva)});//更新下载进度事件autoUpdater.on('download-progress',function(progressObj){mainWindow.webContents.send('downloadProgress',progressObj)})autoUpdater.on('update-downloaded',function(event,releaseNotes,releaseName,releaseDate,updateUrl,quitAndUpdate){ipcMain.on('isUpdateNow',(e,arg)=>{console.log(arguments);console.log("startupdate");//这里有一些代码来处理事件autoUpdater.quitAndInstall();});mainWindow.webContents.send('isUpdateNow')});ipcMain.on("checkForUpdate",()=>{//执行自动更新检查autoUpdater.checkForUpdates();})}//通过主进程向renderer进程发送事件，提示更新信息functionsendUpdateMessage(text){mainWindow.webContents.send('message',text)}注意：添加自动更新检测和事件监听后需要在主进程createWindow中调用updateHandle()，如下图：4.触发自动更新in视图（View）层，并添加自动更新事件监听。触发自动更新：ipcRenderer.send("checkForUpdate");监听自动更新事件：import{ipcRenderer}from"electron";ipcRenderer.on("message",(event,text)=>{console.log(arguments);this.tips=text;});//注意：可以不触发“downloadProgress”事件，只是限制下载速度。ipcRenderer.on("downloadProgress",(event,progressObj)=>;{console.log(progressObj);this.downloadPercent=progressObj.percent||0;});ipcRenderer.on("isUpdateNow",()=>{ipcRenderer.send("isUpdateNow");});注意：子进程中的“downloadProgress”事件可能不会被触发，因为下载速度很快，“downloadProgress”事件会被跳过；只要限制本地下载速度就可以了！为避免多次页面切换造成监听滥用，必须在切换页面前移除监听事件：//组件销毁前移除所有事件监听通道ipcRenderer.removeAll(["message","downloadProgress","isUpdateNow"]);//remove只能移除单个事件，单独打包removeAll移除所有事件5.项目打包执行electron-builder进行打包，windows下会生成安装包exe和latest.yml文件，exe将执行安装软件；生成安装包dmg、zip和latest-mac.yml文件，执行dmg安装软件。注意：在mac上不用签名也可以成功打包，但是不能用于自动更新等需要认证的功能，不能发布到mac应用商店。所以代码签名的MAC包是完整的包。我们这里的一定是一个代码签名的完整包！记住！具体打包过程可以参考：Electron桌面应用打包(npmrunbuild)简介(windows+mac)MAC打包报Error:Couldnotgetcodesignatureforrunningapplicationerror，可以参考：Electron打包Mac安装包代码签名问题解决Windows打包生成文件：Mac打包生成文件：6、软件升级版本，修改package.json中的version属性，例如：修改为version：“1.1.0”（之前为1.0.0）；7、再次执行electron-Builder打包，将Windows下新版本的latest.yml文件和exe文件（mac下latest-mac.yml、zip和dmg文件）放入build->publishinpackage中url对应的地址.json;8、在应用中触发更新检查，electron-updater会自动通过对应url下的yml文件检查更新；windows自动更新示例：mac自动更新示例：附件：项目目录层次结构：本文是否对您的工作或学习有用如果有帮助，请收藏或点赞。有什么不明白或者报错可以留言或者加QQ群140455228交流。注：请支持原创，本文谢绝转载，如有需要可以链接本文。本文链接地址：https://segmentfault.com/a/11...
