赞
踩
一、打包之后不显示elecmentui的图标
1、使用版本
2、解决办法
1) 如果是简单的图标可以使用图片代替(这种对于elementui组件的图标还是不会显示)
2)在vue.config.js配置
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
lintOnSave:false,
pluginOptions:{
electronBuilder:{
customFileProtocol:"/"
}
}
})
二、修改打包之后的app图标
不添加配置默认图标
1、将图片放在public文件夹下面
2、npm install electron-icon-builder
3、修改package.json文件(很奇怪这里只能用png文件不能使用.ico文件)
“electron:generate-icons”:“electron-icon-builder --input=./public/logo.png --output=build --flatten”
4、修改background.js
const win = new BrowserWindow({
width: 800,
height: 600,
icon:'./public/favicon.ico'
})
5、修改vue.config.js文件
pluginOptions:{
electronBuilder:{
customFileProtocol:"/",
win:{
icon:"favicon.ico"
},
nodeIntegration: true
}
}
6、打包 npm run electron:generate-icons 然后再 npm run electron:build
出来的效果图:
重新测试(不需要electron-icon-builder)的步骤:
1、在packge.json文件添加
"win": {
"icon": "__dirname+'icon.ico'"
},
"scripts": {
...
}
2、在background.js添加
const win = new BrowserWindow({
width: 800,
height: 600,
icon:path.join(__dirname,'favicons.ico'), //这个图片放在public下面就行
webPreferences: {
nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION,
contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION
}
})
注:使用favicon测试发现这个图片是app运行时窗口的icon和任务栏的icon
直接打包npm run electron:build
即可
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。