Electron app not showing the app.ico, instead, it shows the default from electron

Question

I'm trying to make a package out of my Electron project, and I'm having a problem with the icon of the already installed application.

The setup application or installer's icon is showing properly, but when I install the application, the only icon showing up correctly is the one at the title bar of the window (I'm on Windows 11), but not the one on the task bar.

I've read lots of articles, issues on GitHub and websites suggesting solutions, and none of them work for me.

The icon is showing correctly when I test the project while developing (npm run start).

Here is my forge.config.js:

module.exports = {
  packagerConfig: {
    icon: "./electron_base/icon"
  },
  rebuildConfig: {},
  makers: [
    {
      name: '@electron-forge/maker-squirrel',
      config: {
        "name": "Electronify",
        "setupIcon": "./electron_base/icon.ico"
      }
    },
    {
      name: '@electron-forge/maker-deb',
        config: {
          options: {
          icon: './electron_base/icon.png'
        }
      },
    },
    {
      name: '@electron-forge/maker-dmg',
      config: {
        icon: './electron_base/icon.icns'
      }
    },
    {
      name: '@electron-forge/maker-zip',
      platforms: ['darwin', 'linux', 'win32'],
    },
  ],
};

And here is my BrowserWindow instance on the main Electron process:

const win = new BrowserWindow({
        width: 1280,
        height: 800,
        fullscreen: false,
        webPreferences: {
            preload: path.join(__dirname, 'preload.js')
        },
        titleBarOverlay: true,
        icon: path.join(__dirname, "icon.ico"),
    })

NOTE: The path where the icons are stored is a subdirectory named electron_base, exactly inside the project root directory, where I also store the main electron process and the ContextBridge (this structure is not my favourite, but I was desperate to find a solution).

Answer 1

In dev mode, __dirname works. In production, please use process.resourcesPath

So it looks like

const resourcePath =
  !process.env.NODE_ENV || process.env.NODE_ENV === "production"
    ? process.resourcesPath // Live Mode
    : __dirname; // Dev Mode

const pathToX = path.join(resourcePath, 'x');