Use a config that would work for both vite and webpack while removing ugly hacks based on eval/Function
What we need: to get the worker urls from the bundler
The problem: bundlers only detect the usage of the new Worker(new URl(...), import.meta.url) syntax and transform it to an usable worker and we need instead to get the worker final url to:
load it using importScripts to support cross-origin workers for most workers
load the worker url inside the worker extHost iframe
Vite: it just detects the syntax using a pattern => easy to hack
Webpack: use advanced code to detect the usage of worker
what doesn't work
Using a local variable named Worker: webpack is aware it's not a real worker and do nothing
Creating a function that create the worker, getting its code using toString then running it in a eval: webpack injects functions into the code that the eval context doesn't have access to
what works:
Overriding window.Worker before and restoring it after => works but may have negative impacts
Use a config that would work for both vite and webpack while removing ugly hacks based on eval/Function
What we need: to get the worker urls from the bundler
The problem: bundlers only detect the usage of the
new Worker(new URl(...), import.meta.url)syntax and transform it to an usable worker and we need instead to get the worker final url to:load it using
importScriptsto support cross-origin workers for most workersload the worker url inside the worker extHost iframe
Vite: it just detects the syntax using a pattern => easy to hack
Webpack: use advanced code to detect the usage of worker what doesn't work
Worker: webpack is aware it's not a real worker and do nothingtoStringthen running it in a eval: webpack injects functions into the code that the eval context doesn't have access towhat works:
Workerfrom another module, whatever the implementation is (probably designed to makeworker_threadswork, see https://webpack.js.org/guides/web-workers/#nodejs)