webpack: Uncaught ReferenceError: global is not defined

Bug report

I have an Electron based application. we do webpack in the render process. It throws error when I run the app Uncaught ReferenceError: global is not defined

If the current behavior is a bug, please provide the steps to reproduce.

What is the expected behavior? It should not throw this error when I run the application

Other relevant information: here is the Error:

index.js?e792:25 Uncaught ReferenceError: global is not defined
    at eval (index.js?e792:25)
    at Object../node_modules/@babel/polyfill/lib/index.js (feb33beb921cb1f5a1b3.worker.js:97)
    at __webpack_require__ (feb33beb921cb1f5a1b3.worker.js:20)
    at eval (eval at ./node_modules/babel-loader/lib/index.js?{"babelrc":false,"presets":["@babel/preset-env", "@babel/preset-react"]}!./node_modules/ts-loader/index.js?{"transpileOnly":true,"configFile":"tsconfig.webpack.json"}!./node_modules/ts-loader/index.js?!./packages/myApp/modules/frameworks/file-provider/box-provider/webworker/box.worker.ts (feb33beb921cb1f5a1b3.worker.js:526), <anonymous>:2:73)
    at Module../node_modules/babel-loader/lib/index.js?{"babelrc":false,"presets":["@babel/preset-env", "@babel/preset-react"]}!./node_modules/ts-loader/index.js?{"transpileOnly":true,"configFile":"tsconfig.webpack.json"}!./node_modules/ts-loader/index.js?!./packages/myApp/modules/frameworks/file-provider/box-provider/webworker/box.worker.ts (feb33beb921cb1f5a1b3.worker.js:526)
    at __webpack_require__ (feb33beb921cb1f5a1b3.worker.js:20)
    at feb33beb921cb1f5a1b3.worker.js:84
    at feb33beb921cb1f5a1b3.worker.js:87

Note: Since it is an electron app: config.target = “electron-renderer”; {global:true};

webpack version: ^4.41.2 Node.js version: 10.16.3 Operating System: windows 10 “@babel/core”: “^7.6.4” Additional tools: chrome 78 Electron version : 7.1.1

About this issue

Original URL
State: closed
Created 5 years ago
Reactions: 6
Comments: 38 (9 by maintainers)

Commits related to this issue

fix global in `electron-renderer` target fix #10035 — committed to xcodebuild/webpack by xcodebuild 4 years ago

Most upvoted comments

We found easy solution for this bug. We had to only add this code to index.html before your bundle.

<body id="app">
    <script>
      global = globalThis //<- this should be enough
    </script>
    <script src="./electron-renderer.js"></script>
  </body>

+48

EdwinIwan on Mar 24, 2020

For me this worked:

app.on('ready', () => {
    mainWindow = new BrowserWindow({
        webPreferences: {
            nodeIntegration: true,
            contextIsolation: false,
        }
    });
});

+36

jbowa on Jun 20, 2021

I’m also getting require is not defined error with this workaround. Is there any other way to solve this?

+11

eden-lane on Dec 29, 2021

on your createWindow(), add the

webPreferences: { nodeIntegration: true, contextIsolation: false }

this will work absolutely…

CarlSaqui29 on Dec 3, 2022

Same for me. global = globalThis causes require is not defined. Does anyone understand this problem? The docs emphasize the importance of not setting contextIsolation to false so this feels like a big deal.

emersonthis on Feb 4, 2022

For me this worked:

app.on('ready', () => {
    mainWindow = new BrowserWindow({
        webPreferences: {
            nodeIntegration: true,
            contextIsolation: false,
        }
    });
});

Please read the documentation before thumb down !! (This is a suggested solution from Electron documentation)

mx51damon on Mar 17, 2022

I’m having the same problem and the solution proposed by @EdwinIwan didn’t work for me.

What did “work” was setting contextIsolation: false as suggested by @jbowa. Still, this isn’t a real solution since I’m leaving my app more exposed given that the renderer process and Electron’s internal processes are no longer isolated from one another. There should be something better, or an explanation as to why it “works” in order to find a better alternative.

Same here. In my app, the solution suggested by @EdwinIwan just changes the error to:

polyfills.js:1 Uncaught ReferenceError: require is not defined

FrancescoBorzi on Dec 25, 2021

Another workaround is to simply not use target: electron-renderer for now, if you don’t need it. web works.

patrickfatrick on Mar 24, 2022

please create a new issue with reproducible repo.

vankop on Mar 8, 2022

I’m having the same problem and the solution proposed by @EdwinIwan didn’t work for me.

What did “work” was setting contextIsolation: false as suggested by @jbowa. Still, this isn’t a real solution since I’m leaving my app more exposed given that the renderer process and Electron’s internal processes are no longer isolated from one another. There should be something better, or an explanation as to why it “works” in order to find a better alternative.

lucas-sg on Oct 28, 2021