How do I change the icon for Electron app

Question

I'm having trouble changing my electron app icon.

mainWindow = new BrowserWindow({
    width: 1280,
    height: 960,
    frame: false,
    icon: __dirname + 'img/joe.icns',
    webPreferences: {
      nodeIntegration: true,
      enableRemoteModule: true,
      // worldSafeExecuteJavaScript: true,
      // contextIsolation: true,
    },

I've referenced stackoverflow and medium.com for my attempt.

I have also attemptted

icon: __dirname + 'src/img/joe.icns',

icon: __dirname + './img/joe.icns',

and other similar structure names.

Directory Structure

as far as i know there must be a manifest.json where u set stuff like this. but i could be wrong — Deniz, Nov 01 '20 at 17:58
https://stackoverflow.com/questions/31529772/how-to-set-app-icon-for-electron-atom-shell-app#:~:text=app%2C%20usually%20in%20node_modules%2Felectron,the%20icon%20via%20cmd%2Bv — Deniz, Nov 01 '20 at 18:00
Thank you for the link, It solved the problem for me. @Deniz — Stream Summer, Nov 01 '20 at 18:05

score 3 · Accepted Answer · answered Nov 01 '20 at 18:03

3

Try this:

icon: path.join(__static, 'joe.icns'),

And put the icon in ./dist_electron/bundled and ./public

answered Nov 01 '20 at 18:03

Majed Badawi

27,616
4
25
48

It resulted in a error code: ReferenceError: __static is not defined ... – Stream Summer Nov 01 '20 at 18:14

score 1 · Answer 2 · answered Nov 01 '20 at 18:11

Referencing stackoverflow, I assumed .icns (icon set) was the only extension allowed for electron apps. Reading Stackoverflow2 provided by @deniz, I've realized ico file type was also available and gave it a try, and it worked. I assumed icns was a complex icon file type, and my icns file was probably not compatible with electron app. Thank you (and sorry) for the effort @Majed Badawi.

icon: __dirname + '/img/joe.ico',

How do I change the icon for Electron app

2 Answers2