max-mapper/menubar

The IconTemplate.png overrides my icons when I package my app

cassidoo opened this issue · 2 comments

Description

I have the following code for my simple app:

const { menubar } = require("menubar");
const path = require("path");

const mb = menubar({
	browserWindow: {
		width: 420,
		height: 520,
	},
	icon: path.join(__dirname, "extraResources", "icon.png"),
	tooltip: "Tester",
});

This works perfectly in development, but when I package this with Electron Forge, my tray icon only shows the IconTemplate.png.

Steps to Reproduce the Problem

  1. Use any icon for the tray
  2. Package the app
  3. The icon is using the IconTemplate.png file, not mine.

Expected Behaviour

My icon should appear in "production", not the default.

Specifications

  • Menubar version: latest
  • Platform: Mac + Windows
  • Electron version: v28.2.1

Other information

My app is a plain HTML file.

I'm hitting this issue as well. Haven't figured out a fix yet. In my case I'm using electron-builder.

@cassidoo I managed to get this worked out by "logging" with a message box like the following to track down where exactly the bundler was putting my files:

dialog.showMessageBox({
  message: JSON.stringify(fs.readdirSync(path.join(__dirname)))
})

Continued adding onto the path then rebuilding until I discovered the icon wasn't at the working directory root at all. I then did the same process starting from process.resourcePath which lead me in the right direction and my final working path to the icon was: path.join(process.resourcesPath, "buildResources", "menuicon.png")

Hope that process helps!