Electron 'Uncaught ReferenceError: require is not defined' in the renderer after upgrading - how do I fix it without turning on nodeIntegration?

Cause: In current Electron, renderer processes have nodeIntegration off and contextIsolation on by default (nodeIntegration has been off since Electron 5, context isolation on since Electron 12, sandbox on since Electron 20). Web page code therefore has no Node.js require. Older tutorials set nodeIntegration: true and contextIsolation: false to make require work; the security guide strongly advises against that, especially for any window that loads remote content. Fix (best first): 1. Keep the secure defaults. Move the Node/Electron work into the main process and expose a narrow API through a preload script: // preload.js const { contextBridge, ipcRenderer } = require('electron'); contextBridge.exposeInMainWorld('electronAPI', { openFile: () => ipcRenderer.invoke('dialog:openFile') }); // main.js ipcMain.handle('dialog:openFile', async () => { /* call dialog or fs here and return the result */ }); Load the preload via webPreferences: { preload: path.join(__dirname, 'preload.js') } when creating the BrowserWindow, then call window.electronAPI.openFile() from the page. 2. Expose one function per action. Do not expose ipcRenderer or its send method wholesale, because any page script could then send arbitrary IPC messages. Validate arguments in the main-process handler. 3. Prefer ipcRenderer.invoke with ipcMain.handle for request/response; avoid sendSync, which blocks the renderer. 4. A sandboxed preload can require only the electron module (contextBridge, ipcRenderer, webUtils and a few others), not Node built-ins such as fs or path. Do the file or OS work in the main process, or bundle the preload script if you need to split it. 5. If a third-party library in the page needs require, bundle it for the browser (webpack, Vite) instead of enabling Node integration. 6. Never combine nodeIntegration: true with loading remote content, and never set contextIsolation to false just to silence the error. Disabling context isolation also disables the sandbox. Verify: the page loads with no ReferenceError, window.electronAPI exists in DevTools, and webPreferences still show nodeIntegration false and contextIsolation true. Sources: https://www.electronjs.org/docs/latest/tutorial/context-isolation https://www.electronjs.org/docs/latest/tutorial/security https://www.electronjs.org/docs/latest/tutorial/ipc