Electron Forge项目将Tray设为全局变量仍自动消失如何解决？

问题根因 #

你已经正确将Tray实例声明为全局变量避免了GC回收问题，当前触发托盘消失的直接原因是实例化Tray时传入了空字符串作为图标路径：

icon = new Tray('')

Electron无法加载有效图标时，会在资源加载超时后自动销毁托盘实例，就会出现初始化后几秒图标消失的现象。

修复步骤 #

• 准备合规的托盘图标：Windows建议使用16x16/32x32像素的ico格式图标，macOS建议使用18x18/36x36像素的png格式图标，存放到项目的静态资源目录下。
• 调整代码使用绝对路径加载图标，避免相对路径在开发、打包环境下路径不匹配的问题：

import { app, BrowserWindow, Menu, Tray } from 'electron';
import * as path from 'path';

declare const MAIN_WINDOW_WEBPACK_ENTRY: string;

let icon: Tray | null = null

if (require('electron-squirrel-startup')) { // eslint-disable-line global-require
  app.quit();
}

const createWindow = (): void => {
  const mainWindow = new BrowserWindow({
    height: 600,
    width: 800,
  });

  mainWindow.loadURL(MAIN_WINDOW_WEBPACK_ENTRY);
  mainWindow.webContents.openDevTools();

  // 替换为你的图标实际存放路径，示例为图标放在src/main/static/tray.ico
  const iconPath = path.resolve(app.getAppPath(), 'src/main/static/tray.ico');
  // 可打印路径确认文件存在
  // console.log('托盘图标路径', iconPath)
  icon = new Tray(iconPath)

  const contextMenu = Menu.buildFromTemplate([
    {
      label: 'teste', click: () => console.log('hello world')
    }
  ])
  icon.setContextMenu(contextMenu)
  // 可选配置：设置托盘悬停提示文本
  icon.setToolTip('你的应用名称')
};


app.on('ready', createWindow);


app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit();
  }
});

app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow();
  }
});

• 如果你使用Electron Forge的webpack模板，需要在webpack主进程配置中添加CopyPlugin规则，将静态图标资源复制到打包后的输出目录，避免打包后生产环境找不到图标。

内容的提问来源于stack exchange，提问作者Breno Macêdo