2022-05-17 乐帮网
electron
electron 18.2.3 打包的时候需要更新图标,前提条件是我使用的是官方推荐的forge方式打包,过程如下:
首先安装 electron-forge,使用以下命令:
npm install --save-dev @electron-forge/cli
使用以下命令配置 Forge
npx electron-forge import
注意以上命令一个app只执行一次就够了,重复打包不需要重复执行。执行完以上命令后在我们的package.json里会有一些更改。为了更改图标首先得搞清楚图标显示的两个地方(1) exe的图标 (2)electron网页打开的时候显示在浏览器里的图标。
首先改生成的exe图标,我们需要修改package.json,这里修改如下:
"config": {
"forge": {
"packagerConfig": {
"name": "winStartup",
"icon": "favicon.ico"
},
"makers": [
{
"name": "@electron-forge/maker-squirrel",
"config": {
"name": "dts_client"
}
},
{
"name": "@electron-forge/maker-zip",
"platforms": [
"darwin"
]
},
{
"name": "@electron-forge/maker-deb",
"config": {}
},
{
"name": "@electron-forge/maker-rpm",
"config": {}
}
]
}
}
主要是两个部分"name": "winStartup" 和 "icon": "favicon.ico" 名称就是我们打包成exe的名称,icon是我们图标的路径,我是放到根目录。
第二部分是修改浏览器中的图标:在main.js中或者你的是index.js中修改如下:
new BrowserWindow({
fullscreen: true,
width: 1280,
height: 720,
icon: `${__dirname}/favicon.ico`,
autoHideMenuBar: true
// webPreferences: {
// preload: path.join(__dirname, 'preload.js')
//}
})
利用ico直接指定图标。
最后使用以下命令打包发布:
npm run make
> my-electron-app@1.0.0 make /my-electron-app
> electron-forge make
✔ Checking your system
✔ Resolving Forge Config
We need to package your application before we can make it
✔ Preparing to Package Application for arch: x64
✔ Preparing native dependencies
✔ Packaging Application
Making for the following targets: zip
✔ Making for target: zip - On platform: darwin - For arch: x64
关注我的微信公众号
在公众号里留言交流
投稿邮箱:1052839972@qq.com
庭院深深深几许?杨柳堆烟,帘幕无重数。
玉勒雕鞍游冶处,楼高不见章台路。
雨横风狂三月暮。门掩黄昏,无计留春住。
泪眼问花花不语,乱红飞过秋千去。
如果感觉对您有帮助
欢迎向作者提供捐赠
这将是创作的最大动力