vitejs / vite

Next generation frontend tooling. It's fast!
http://vite.dev
MIT License
68.42k stars 6.17k forks source link

Share chunks between multiple ESM Workers #18068

Open ferferga opened 1 month ago

ferferga commented 1 month ago

Describe the bug

When bundling WebWorkers in the es format, all the modules imported by the worker are inlined inside the worker chunk and no import syntax is used.

In the following reproduction, there's the following setup:

By analyzing the build output, 3 chunks are emitted:

For WebWorkers in ESM format, the same behaviour is expected: instead of inlining the imported modules in the worker's chunk, the worker should import from another common chunk.

Specifically, in the reproduction, I expect the shared chunk to contain the contents of isBool (from validation.ts) and comlink's expose and that both are imported by the workers (FancyWorker1 just needs to import expose).

To better see the problem, minification is already disabled.

Reproduction

https://stackblitz.com/edit/vue3-vite-typescript-starter-rayp8m

Steps to reproduce

  1. Run npm ci && npm run build in the StackBlitz project
  2. Go to the dist folder and observe the output of the main thread's chunks (remember, called main and secondary) image
  3. Observe the emitted chunks for the worker and how both have Comlink's expose inlined (with FancyWorker1 inlining isBool too!) image

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 18.20.3 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.2.3 - /usr/local/bin/npm
    pnpm: 8.15.6 - /usr/local/bin/pnpm
  npmPackages:
    @vitejs/plugin-vue: 5.1.3 => 5.1.3 
    vite: 5.4.3 => 5.4.3

Used Package Manager

npm

Logs

No response

Validations

stackblitz[bot] commented 1 month ago

Fix this issue in StackBlitz Codeflow Start a new pull request in StackBlitz Codeflow.