electron-webpack
electron-webpack copied to clipboard
How to set custom app icon?
Hi guys, I read the docs but didn't find anything regarding how to set an app icon. Now it uses the default one
I have the same question. I thought I could get pretty close by reading the electron-builder docs. For that project, it is recommended (for Linux) to dump an icon.png file into build/icons in the project root.
I can confirm this kind of does something. It generates a .icon-set folder in the dist folder which it would not otherwise do when running the npm dist command. However, in my case, I'm just trying to quick and dirty build an AppImage to test this and the resulting artifact does not have an icon in the file explorer or in the dock after launching.
Windows and Mac seem to have some other file extension requirements depending on the target.
It would be nice to know if I am on the right track here or not.
Try building like this: package.json put the path to the build icons.
"build": {
"files": [
"build/*"
]
}
index.js - main process file
const path = require('path');
const iconPath = path.join(__dirname, "build", "icon.png");
let window = new BrowserWindow({
icon: iconPath
})
Hello, I did it like this
let iconPath;
function createWindow () {
// Create the browser window.
win = new BrowserWindow({
width: 900,
height: 600,
webPreferences: {
nodeIntegration: true
},
icon: iconPath
})
if (isDevelopment && !process.env.IS_TEST) {
iconPath = require('path').join('img/so-g.png')
} else {
iconPath = require('path').join(process.resourcesPath, 'img', 'soluti-g.png')
}
Now in package.json it looks like this
"extraResources": [
{
"from": "./img/",
"to": "img",
"filter": [
"**/*"
]
}
]
but it doesn't work properly, help me please
I don't know about extraResources and resourcesPath, but I would rather go for the static assets folder and __static placeholder. I'm pretty sure it works that way. Check the docs for static assets https://webpack.electron.build/using-static-assets
I did so ....
'path' import path
Right inside the
**createWindow () {
win = new BrowserWindow({
width: 1366,
height: 768,
webPreferences: {
nodeIntegration: true
},
icon: path.join(__static, 'logo.png')
})
```**
Inside the public insert the logo.
So it works
But I ask, is that correct?
Thank you for your attention.
const nativeImage = electron.nativeImage;
const icon = require('@/any/path/icon.png');
// Create the browser window.
mainWindow = new BrowserWindow({
//... your config
icon: nativeImage.createFromDataURL(icon.default)
});
Finally after googling for a hour i found this package
Get it from
https://www.electron.build/icons