Electron打包图标不显示解决方案

1. 现象

最近做了一个vue3+electron-vue+elementplus的小软件，最终打包生成exe应用程序，应用程序的logo和启动logo状态栏logo、安装logo全部正常，本地yarn run serve ，左上角logo也正常，但是一打包。坐上logo就不显示了。如果去掉图标配置，electron使用默认logo，就可以正常显示。踩坑良久，搜了许许多多解决方案，终于解决了这一问题。

2. 说明

electron必须使用256*256的图片，所以需要提前准备这样大小的图片。我们需要先准备一张256 * 256的png格式的图片。如果需要ico可以用这个网站生成256 * 256 的ico图片。

http://ico.116wz.com/

3. 操作步骤

把我们准备的png图片放到静态资源包中，先使用256 * 256的png图片进行yarn run build打包

打包成功后，在打包文件夹中找到.icon-ico文件夹。里边又electron生成一个256 * 256的ico文件。文件名字为icon.ico

把icon.ico复制到根目录，修改icon路径为icon.ico

重新打包。如果打包异常就执行delcatch脚本

（清理window对electron的缓存）清理t完之后，就能成功打包拉

4. 代码

builderOptions: {  productName: "zeus",  mac: {  // icon: "./public/login2.ico", //图标路径  },  win: {  //这里先用png，后用electron打包生成的icon.ico  icon: "./public/logo.png", //图标路径,  target: [{  target: 'nsis', // 利用nsis制作安装程序  'arch': [  'x64', // 64位  'ia32'  ]  }]  },  nsis: {  oneClick: false, // 一键安装  perMachine: true, // 是否开启安装时权限限制（此电脑或当前用户）  allowElevation: true, // 允许请求提升。 如果为false，则用户必须使用提升的权限重新启动安装程序。  allowToChangeInstallationDirectory: true, // 允许修改安装目录  installerIcon: "./public/win.ico", // 安装图标  uninstallerIcon: "./public/win.ico", //卸载图标  installerHeaderIcon: "./public/win.ico", // 安装时头部图标  createDesktopShortcut: true, // 创建桌面图标  createStartMenuShortcut: true, // 创建开始菜单图标  shortcutName: "zeus", // 图标名称   }  }

5. delcatch脚本

清除windows对electron的缓存。

1. 新建delecatch.bat文件
2. 复制脚本内容到文件中去
3. 以管理员身份执行脚本
4. 再次打包electron

rem 关闭Windows外壳程序explorer  taskkill /f /im explorer.exe  rem 清理系统图标缓存数据库  attrib -h -s -r "%userprofile%\AppData\Local\IconCache.db"  del /f "%userprofile%\AppData\Local\IconCache.db"  attrib /s /d -h -s -r "%userprofile%\AppData\Local\Microsoft\Windows\Explorer\*"  del /f "%userprofile%\AppData\Local\Microsoft\Windows\Explorer\thumbcache_32.db" del /f "%userprofile%\AppData\Local\Microsoft\Windows\Explorer\thumbcache_96.db" del /f "%userprofile%\AppData\Local\Microsoft\Windows\Explorer\thumbcache_102.db" del /f "%userprofile%\AppData\Local\Microsoft\Windows\Explorer\thumbcache_256.db" del /f "%userprofile%\AppData\Local\Microsoft\Windows\Explorer\thumbcache_1024.db" del /f "%userprofile%\AppData\Local\Microsoft\Windows\Explorer\thumbcache_idx.db" del /f "%userprofile%\AppData\Local\Microsoft\Windows\Explorer\thumbcache_sr.db"  rem 清理 系统托盘记忆的图标  echo y|reg delete "HKEY_CLASSES_ROOT\Local Settings\Software\Microsoft\Windows\CurrentVersion\TrayNotify" /v IconStreams echo y|reg delete "HKEY_CLASSES_ROOT\Local Settings\Software\Microsoft\Windows\CurrentVersion\TrayNotify" /v PastIconsStream  rem 重启Windows外壳程序explorer  start explorer