Electlon开发出现的问题

这是因为electron版本造成的问题

解决办法：

1. 首先在项目根目录下安装@electron/remote包：npm install @electron/remote --sav

2. 在主线程中引入require("@electron/remote/main").initialize(); require("@electron/remote/main").enable(mainWindow.webContents);

3. 最后在渲染进程中引入const BrowserWindow = require("@electron/remote").BrowserWindow;

最终效果：

 主线程:

// BrowserWindow监听初始化完成的生命周期

// Menu 创建新的菜单

const {

    app,

    BrowserWindow,

    Menu

} = require('electron')

// 热加载

const reloader = require('electron-reloader')

reloader(module)

// 监听初始化完成的生命周期

app.on('ready', () => {

    const mainWindow = new BrowserWindow({

        width: 1000,

        height: 1000,

        frame: false, // 创建一个无边框窗口

        webPreferences: {

            // 开启渲染进程使用node

            nodeIntegration: true,

            contextIsolation: false,

            //preload脚本会无视nodeIntegration和sandbox，排查BrowserWindow的preload 的javascript脚本是否启用contextIsolation（类似chrome插件机制）

            // 开启渲染进程的remote模块

            enableRemoteModule: true

        }

    })

    require("@electron/remote/main").initialize(); // 初始化

    require("@electron/remote/main").enable(mainWindow.webContents);

    mainWindow.loadFile('./src/index.html')

 

    mainWindow.webContents.openDevTools() // 直接打开调试工具

    require('./menu.js')

})

 渲染进程：

const BrowserWindow = require("@electron/remote").BrowserWindow;

const newWindow = document.querySelector('.new-window')

// console.log(newWindow);

newWindow.onclick = function () {

    new BrowserWindow({

        width: 300,

        height: 300

    })

}