electrondemo运行起来后,大家经常想修改electron的图标。那么在修改图标的过程中,又遇到了什么事情呢?大家可以看看苏南大叔的electron图标更换过程经验。

苏南大叔:electron 使用 builder 打包的时候,如何更换程序图标? - electron-builder-icon
electron 使用 builder 打包的时候,如何更换程序图标?(图11-1)

本次实验的基础是:win环境,electron+vuedemobuilder打包模式。

前言

首先,大家需要知道:electronico更换过程,是发生在最后的打包阶段,而不是开发过程中的。也就是说,大多数情况下,这个图标是打包的时候决定的。而electron的打包过程,可选的工具非常多。目前我们可能会在packagerbuilder之间进行选择。

其次,electronico,实际上也随系统不同而不同,有win版、mac版、linux版的区分,而普通的ico也可能是不能满足需求的,可能你需要做个特殊的套娃ico图标,才能在electron中正常显示。具体的ico制作过程,大家可以点击这里查看苏南大叔的文章:

查看效果

苏南大叔运行命令后,就可以看到相关效果了。

npm run build

苏南大叔:electron 使用 builder 打包的时候,如何更换程序图标? - ico_13
electron 使用 builder 打包的时候,如何更换程序图标?(图11-7)

苏南大叔:electron 使用 builder 打包的时候,如何更换程序图标? - ico_14
electron 使用 builder 打包的时候,如何更换程序图标?(图11-8)

苏南大叔:electron 使用 builder 打包的时候,如何更换程序图标? - ico_15
electron 使用 builder 打包的时候,如何更换程序图标?(图11-9)

苏南大叔:electron 使用 builder 打包的时候,如何更换程序图标? - ico_99
electron 使用 builder 打包的时候,如何更换程序图标?(图11-10)

苏南大叔:electron 使用 builder 打包的时候,如何更换程序图标? - ico
electron 使用 builder 打包的时候,如何更换程序图标?(图11-11)

总结

根据使用的打包方式的不同,具体的修改ico的手段也是不一样的,但是都是可以定制ico的。苏南大叔带给大家的electron系列教程中,会陆续介绍其他的更换ico的方法。大家可以继续关注苏南大叔的electron的相关文章:https://newsn.net/tag/electron/

如果本文对您有帮助,或者节约了您的时间,欢迎打赏瓶饮料,建立下友谊关系。
本博客不欢迎:各种镜像采集行为。请尊重原创文章内容,转载请保留链接作者。
本站采用创作共用版权协议, 要求署名、非商业用途和相同方式共享。
转载本站内容必须也遵循“署名-非商业用途-相同方式共享”的创作共用协议。
未经许可,规模化镜像抄袭本站内容的行为,将会根据有关法律法规进行维权。
程序如此灵动~》下所有原创文章,如被用于商业用途,请您按规定支付稿费。

 【加群】加入QQ群【175454274】和大家一起讨论这个问题

 【源码】本文代码片段及相关软件,请点此获取

 【绝密】秘籍文章入口,仅传授于有缘之人   electron    builder

本站的忠实读者小伙伴,正在阅读下面这些文章: