electron使用remote报错

在 Electron 14 及更高版本中，内置的 remote 模块已经被移除，因此直接使用 require('electron').remote 会导致 Uncaught TypeError: Cannot read property 'BrowserWindow' of undefined 的错误。为了解决这个问题，你需要使用 @electron/remote 模块来替代内置的 remote 模块。

以下是解决步骤：

1. 安装 @electron/remote 模块

在项目根目录下运行以下命令来安装 @electron/remote：

npm install --save @electron/remote

2. 在主进程中初始化和启用 @electron/remote

在主进程代码（如 main.js）中，初始化 @electron/remote 并启用它：

const { app, BrowserWindow } = require('electron');
const { initialize, enable } = require('@electron/remote/main');

initialize(); // 初始化 @electron/remote

app.on('ready', () => {
  const mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true,
      contextIsolation: false,
      enableRemoteModule: true, // 启用 remote 模块
    },
  });

  enable(mainWindow.webContents); // 为当前窗口启用 @electron/remote
  mainWindow.loadFile('index.html');
});

3. 在渲染进程中使用 @electron/remote

在渲染进程中，使用 @electron/remote 替代原来的 electron.remote：

const { BrowserWindow } = require('@electron/remote');

document.getElementById('open-new-window').addEventListener('click', () => {
  const newWindow = new BrowserWindow({
    width: 400,
    height: 400,
    webPreferences: {
      nodeIntegration: true,
      contextIsolation: false,
    },
  });
  newWindow.loadFile('new-window.html');
});

注意事项

• 版本兼容性 ：确保你的 Electron 版本与 @electron/remote 模块兼容。@electron/remote 适用于 Electron 14 及更高版本。
• 安全性 ：虽然 @electron/remote 提供了方便，但使用它可能会降低应用的安全性，因为它允许渲染进程访问主进程的对象。如果可能，尽量避免在生产环境中使用它。

通过以上步骤，你可以解决在 Electron 14 及更高版本中使用 remote 模块时遇到的 Uncaught TypeError: Cannot read property 'BrowserWindow' of undefined 的问题。