浏览器窗口显示透明窗口而不是使用 Electron Builder 的路线

问题描述 投票:0回答:0

用于创建菜单栏的代码

const createMenubar = () => {
  //our window you can chanege the size  and other

  const devServerURL = createURLRoute("http://localhost:3000", "onboarding");

  const fileRoute = createFileRoute(
    path.join(__dirname, "../", "index.html"),
    "onboarding"
  );

  window = new BrowserWindow({
    width: 550,
    height: 675,
    show: false,
    resizable: false,
    frame: false,
    fullscreenable: false,
    transparent: true,
    minimizable: false,
    maximizable: false,
    webPreferences: {
      nodeIntegration: false, // Default is false
      contextIsolation: true, // Default is true
      preload: path.join(__dirname, "preload.js"), // Use of preload.jsc
      backgroundThrottling: false,
      devTools: true,
    },
  });

  !app.isPackaged
    ? window.loadURL(devServerURL)
    : window.loadFile(...fileRoute);

  createTray();

  window.on("blur", () => {
    window.hide();
  });

  window.on("show", () => {
    // app.on("did-become-active", (event, data) => {
    if (window) window.webContents.send("app-opened", true);
    // });
  });

  window.on("ready-to-show", () => {
    // console.log(process.env);

    toggleWindow();
    setTimeout(() => {
      window.webContents.send("set-user-status", true);
    }, 1000);

    window.webContents.on("before-input-event", (event, input) => {
      console.log(input);

      if (input.meta && input.key.toLowerCase() === "q") {
        event.preventDefault();

        window.webContents.send("set-user-status", false);

        setTimeout(() => {
          app.exit();
        }, 1000);
      }
    });

    if (!app.isPackaged) window.webContents.openDevTools({ mode: "detach" });

    // window.webContents.on('before-input-event', (event, input) => {
    //   if (input.control && input.key.toLowerCase() === 'i') {
    //     console.log('Pressed Control+I')
    //     event.preventDefault()
    //   }
    // })

    //

    // window.webContents.send("alert", "checking for updates");

    
    if (app.isPackaged) {
    }
    // .then((response) => {
    //   window.webContents.send("alert", `updates response: ${response}`);
    // })
    // .catch((err) => {
    //   window.webContents.send("alert", `updates error: ${err}`);
    // });
  });

  // process.on("exit", () => {
  //   window.webContents.send("set-user-status", false);
  // });
};

用于创建入职窗口的代码

const createOnboardingWindow = (data) => {
  if (onboardingWindow) onboardingWindow.close();

  //our window you can chanege the size  and other

  onboardingWindow = new BrowserWindow({
    width: parseInt(width * 0.7),
    height: parseInt(height * 0.8),
    maxWidth: windowSize.width,
    maxHeight: windowSize.height,
    transparent: true,
    resizable: true,
    frame: false,
    show: false,
    webPreferences: {
      nodeIntegration: true,
      contextIsolation: true, // Default is true
      preload: path.join(__dirname, "preload.js"), // Use of preload.jsc
      backgroundThrottling: false,
    },
  });

  const xSpacing = parseInt((width - windowSize.width) / 2);
  const ySpacing = parseInt((height - windowSize.height) / 2) + 20;

  onboardingWindow.setPosition(xSpacing, ySpacing, false);

  const devServerURL = createURLRoute("http://localhost:3000", "onboarding");

  const fileRoute = createFileRoute(
    path.join(__dirname, "../", "index.html"),
    "onboarding"
  );

  !app.isPackaged
    ? onboardingWindow.loadURL(devServerURL)
    : onboardingWindow.loadFile(...fileRoute);

  // Automatically open Chrome's DevTools in development mode.
  if (!app.isPackaged) {
    onboardingWindow.webContents.openDevTools();
  }

  if (process.defaultApp) {
    if (process.argv.length >= 2) {
      app.setAsDefaultProtocolClient("meetingReminder", process.execPath, [
        path.resolve(process.argv[1]),
      ]);
    }
  } else {
    app.setAsDefaultProtocolClient("meetingReminder");
  }

  return onboardingWindow;
};

每次应用程序准备就绪时,我都会检查入职是否已完成,然后打开菜单栏窗口。入职窗口正常工作并显示正确的路线。

但是,菜单栏窗口不显示路由中的内容,而是显示透明屏幕Take a look at how the menubar is showing now

我以为这可能是路由配置的问题,但在以前的版本中这是相同的配置,对此没有做任何更改,但它似乎不起作用。这是路线配置:

menubar={
          <>
            <Route path="/" element={<App />} />
            <Route path="/signin" element={<Signin />} />
            <Route path="/settings" element={<Settings />} />
          </>
        }
        onboarding={
          <>
            <Route path="/" element={<Onboarding />} />
            <Route path="/signup" element={<Onboarding />} />
            <Route path="/verifyphone" element={<Onboarding />} />
            <Route path="/welcome" element={<Onboarding />} />
          </>
        }
        notification={
          <>
            <Route path="/" element={<Notify />} />
          </>
        }
        alert={
          <>
            <Route path="/" element={<Alert />} />
          </>
        }

应用程序在开发环境中正常运行,没有错误。这可能是它呈现的路线中的任何错误吗?没有在菜单栏中显示路线的开发环境没有错误。

此错误仅在生产环境中显示,其中其他路线(如登录)正常工作。

如果有人能让我知道任何修复方法,让菜单栏窗口显示路线,我将不胜感激。谢谢。

如果我需要分享任何其他代码,请告诉我。

--

尝试检查它正在渲染的应用程序路由是否有任何错误,它在控制台中显示错误,但开发人员中的应用程序正常工作而没有显示透明屏幕。

试图检查路由是否有任何错误,但其他路由似乎可以在相同的配置下正常工作。

在生产环境中只显示透明屏幕

electron desktop-application electron-builder
© www.soinside.com 2019 - 2024. All rights reserved.