Electron应用点击菜单项出现主进程JS错误，如何修复？

你遇到的错误和node_modules权限完全无关，核心问题是Electron主进程和渲染进程的API混淆：

• Main.js是主进程代码，运行在Node.js环境下，没有浏览器环境的document对象；
• createNewFile函数里调用的document.getElementById是渲染进程（浏览器页面）的专属API，主进程直接调用必然触发JS错误，这就是你看到的主进程报错提示的原因。
• 至于console.log无反应，是因为主进程的日志不会显示在渲染进程的控制台里，需要切换到Electron开发者工具的「Main process」面板才能查看。

下面提供两种常用的修复方式：

方式1：用IPC实现主-渲染进程通信（推荐） #

通过Electron的IPC机制，让主进程在点击菜单时向渲染进程发送指令，由渲染进程处理DOM操作：

1. 修改主进程代码（Main.js）：

const { Menu, ipcMain, app, BrowserWindow } = require('electron')

let mainWindow;

// 初始化应用与窗口
app.whenReady().then(() => {
  mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true,
      contextIsolation: false
    }
  })
  mainWindow.loadFile('index.html')

  // 构建并设置应用菜单
  const menu = [
    {
      label: 'File',
      submenu: [
        {
          label: 'New',
          click: () => {
            // 向渲染进程发送指令
            mainWindow.webContents.send('trigger-new-file-window')
          },
        }
      ]
    }
  ];
  Menu.setApplicationMenu(Menu.buildFromTemplate(menu))
})

2. 在渲染进程的JS文件（比如index.html引入的renderer.js）中监听IPC指令：

const { ipcRenderer } = require('electron')

// 监听主进程的指令，执行DOM操作
ipcRenderer.on('trigger-new-file-window', () => {
  document.getElementById('newFileWindow').classList.remove('hiddenFileWindow')
})

方式2：直接在渲染进程创建菜单（适合简单场景） #

如果菜单逻辑不需要和主进程深度交互，可以直接在渲染进程里创建菜单：

1. 主进程开启remote模块支持（Main.js窗口配置）：

new BrowserWindow({
  webPreferences: {
    enableRemoteModule: true,
    contextIsolation: false
  }
})

2. 渲染进程代码（renderer.js）：

const { Menu } = require('electron').remote

function createNewFile() {
  document.getElementById('newFileWindow').classList.remove('hiddenFileWindow')
}

// 直接在渲染进程构建菜单
const menu = [
  {
    label: 'File',
    submenu: [
      {
        label: 'New',
        click: () => createNewFile()
      }
    ]
  }
];
Menu.setApplicationMenu(Menu.buildFromTemplate(menu))

内容的提问来源于stack exchange，提问作者Whu00