Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Issue with Worker that imports sth from vendor chunk

See original GitHub issue

Describe the bug

Everything works perfectly while developing. But after building I get

Uncaught ReferenceError: global is not defined
    at vendor.f5fc9a77.js:31

Tracking down the error shows that it has to do with popper.js which is used by v-tooltip. Obviously it is not meant to be used in a worker context. But because the worker imports another library, which is also built into the vendor chunk, it is being executed on the worker.

Reproduction

Here you can find a minimal project reproducing the issue. v-tooltip is used in some component and the worker imports another library (doesn’t matter which one).

https://gitlab.com/synphonyte/viteWorkerIssue

Run vite build and serve the resulting files in folder dist. You will the see the above mentioned error in the browsers dev tools.

System Info

Output of npx envinfo --system --npmPackages vite,@vitejs/plugin-vue --binaries --browsers:

  System:
    OS: macOS 11.2.3
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Memory: 109.63 MB / 32.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.14.0 - ~/.nvm/versions/node/v14.14.0/bin/node
    Yarn: 1.22.5 - ~/.yarn/bin/yarn
    npm: 6.14.8 - ~/.nvm/versions/node/v14.14.0/bin/npm
  Browsers:
    Chrome: 89.0.4389.128
    Firefox: 87.0
    Firefox Nightly: 85.0a1
    Safari: 14.0.3
  npmPackages:
    @vitejs/plugin-vue: ^1.2.1 => 1.2.1 
    vite: ^2.1.5 => 2.1.5

Used package manager: yarn

Issue Analytics

State:
Created 2 years ago
Comments:5 (4 by maintainers)

Top GitHub Comments

1reaction

patak-devcommented, Mar 6, 2022

We are no longer splitting the vendor chunk by default, so that may be the reason it works now

0reactions

bluwycommented, Mar 6, 2022

I can’t seem to reproduce this. The repro worked fine for me without any errors, perhaps something was fixed in popperjs? Or perhaps the recent web workers improvement in Vite had fixed this. I’ll close this for now, but feel free to let me know if the issue still persists and provide a repro along side.

Top Results From Across the Web

Worker() imports chunks further imports · Issue #11768 - GitHub

Bug report What is the current behavior? When using webpack's native Worker loader, imports from within the worker are split into chunks.

Webpack: Common chunks for code shared between ...

serviceWorker.register webpack will automatically create a new entrypoint for a web worker. new Worker(new URL("./worker.js", import ...

Web Workers | webpack - JS.ORG

As of webpack 5, you can use Web Workers without worker-loader . Syntax. new Worker(new URL('./worker.js', import.meta.url)); // or customize the chunk name ......

Bundle Splitting - SurviveJS

A common use case is extracting so called vendor bundle that contains third-party dependencies. The split allows the client to download only the...

webpack/webpack - Gitter

Hello all, I'm having a lot of trouble getting webpack to never duplicate files between async chunks. Is there a generic way to...