Uncaught ReferenceError: require is not defined

[iKBAHT]

• Electron Version:
  from 5.0.0-beta.5 to 5.0.0-beta.1
• Operating System:
  macOS 10.14.3
• Last Known Working Electron version::
  4.0.7

Problem

Build and pack passed well, but after run app, I see an error in console Uncaught ReferenceError: require is not defined - at Object.electron - at __webpack_require__.

Screenshots

Additional Information

We use Typescript, electron-builder, webpack.

[welcome]

👋 Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

To help make it easier for us to investigate your issue, please follow the contributing guidelines.

[MarshallOfSound]

The default for nodeIntegration changed from true to false as per our breaking changes document.

[iKBAHT]

How can I find the breaking changes document?

[MarshallOfSound]

https://github.com/electron/electron/blob/master/docs/api/breaking-changes.md

[bokele]

in your index.js

const w = new BrowserWindow({
webPreferences: {
nodeIntegration: true
}
})

[Sanjit1]

You could use Browserify to fix your issue, had it been a web page or a website. But since you are using Electron to render html, you just need to set node integration to true under web preference: like shown here.

[tolbxela]

in your index.js

const w = new BrowserWindow({
webPreferences: {
nodeIntegration: true
}
})

Thanks! Have solved my problem.

[smprime]

npm i @angular-devkit/build-angular -D

[873261648]

Need to change webPreferences.nodeIntegration to true when new BrowserWindow
mainWindow = new BrowserWindow({ width: 1000, height: 600, webPreferences: { nodeIntegration: true } });

[adnan00733]

Thanks @bokele You are a life saver. :)

[btargac]

setting nodeIntegration to true is the easy way, bu keeping it false is more secure as documentation tells, I ve found this https://stackoverflow.com/questions/52236641/electron-ipc-and-nodeintegration that may help future readers.

[mahdisalmanzade]

actually i added nodeIntergration = true but dosent work still

[wkpdd]

@tolbxela Thanks a lot mate

[the94air]

It didn't work for me because webPreferences.contextIsolation was set to true. Be careful when setting that option to false though https://www.electronjs.org/docs/tutorial/context-isolation#security-considerations.

[brntsllvn]

Assuming electron 12.0.0

set contextIsolation: false

Something like...

webPreferences: {
      nodeIntegration: true,
      contextIsolation: false,
      enableRemoteModule: true,
    }

reference: https://stackoverflow.com/a/66455544/4097181

[ruymon]

@brntsllvn Adding

webPreferences: {
      nodeIntegration: true,
      contextIsolation: false,
      enableRemoteModule: true,
    }

Works like a charm!! Thing is, do these other properties affect your application in any way?

Regards,

[eric-burel]

Hi guys, any idea how to debug which package/piece of code is triggering this error? Proposed solutions are hacks, they lead to an insecure behaviour, the app needs an actual update to have a more secure behaviour. But the problem is that it's quite difficult to identify the faulty code.

[btargac]

where do you get this error ? I guess it is on runtime ? if you can open devtools on the running app then console error should contain the required information about the stack trace with the actual package causing it

[eric-burel]

I'll try to share a screen but it seems to be obsfuscated by webpack dev server, despite having source maps. I'll check in production if the error is clearer. Yes runtime indeed.
For instance this issue may appear with electron-log (fix is documented hopefully)

Edit: it basically look like in this Stack Overflow question: https://stackoverflow.com/questions/59537125/require-doesnt-appear-in-my-code-but-webpack-keeps-throwing-the-error-require
The log are pretty obscure, sadly leading people to keep nodeIntegration and remove contextIsolation in their app.