ReferenceError: Can't find variable: require

[jerrygreen]

This example works in electron, but it's broken when I open localhost:8888/home in browser. I see the following error in devtools console:

ReferenceError: Can't find variable: require

[saltyshiomix]

Hi @jerrygreen !
Thank you for your question.

Because NEXT's webpack config is optimized for electron like this:

// renderer/next.config.js
module.exports = {
  webpack: (config) => Object.assign(config, {
    target: 'electron-renderer',
  }),
};

So if you open the Chrome browser, you will get that errors because electron's browser is Chromium.

If you want to debug renderer (web) process in your browser, we must change next.config.js:

module.exports = {
  webpack: (config) => Object.assign(config, {
    // but this is not performant for Electron's browser
    target: 'web',
  }),
};

[jerrygreen]

@saltyshiomix huh, just checked it, it indeed works. So it's a question of optimization... Thank you for your feedback!