vite 6 potential bundle size regression (CJS, ESM)

[skovhus]

Describe the bug

When using the prosemirror-utils dependency the vite@6 bundle ends up 20% bigger than vite@5 – due to ESM and CJS ending up in the same bundle (see stats-vite5.html and stats-vite6.html).

Removing the prosemirror-utils dependency fixes the problem, but question is, can this be considered a vite 6 bundle size regression – or just a bug in the library definition?

Reproduction

https://github.com/skovhus/vite6-bundle-size-regression

Steps to reproduce

No response

System Info

System:
    OS: macOS 15.0.1
    CPU: (12) arm64 Apple M2 Max
    Memory: 239.70 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.11.0 - ~/.nvm/versions/node/v22.11.0/bin/node
    Yarn: 1.22.21 - ~/.nvm/versions/node/v20.11.1/bin/yarn
    npm: 10.9.0 - ~/.nvm/versions/node/v22.11.0/bin/npm
    pnpm: 9.1.1 - ~/.nvm/versions/node/v20.11.1/bin/pnpm
    bun: 1.1.2 - ~/.bun/bin/bun
    Watchman: 2024.10.21.00 - /opt/homebrew/bin/watchman
  Browsers:
    Chrome: 131.0.6778.86
    Safari: 18.0.1
  npmPackages:
    vite: ^6.0.1 => 6.0.1

Used Package Manager

pnpm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[sapphi-red]

Summary: It's not a bug, and is actually a bug fix. The library should add module condition pointing to the same file with import condition.

---

In Vite 5.x, there was a bug that mixed the cache of require resolution and import resolution and Vite 6 fixed that. While this is a more correct behavior, dual package hazard happens a bit more frequently (it won't happen if the package author writes a proper exports field). This causes the bundle size to increase.

For example, in this project, in Vite 6 prosemirror-transform@1.7.3 gets bundled twice. One for prosemirror-transform@1.7.3/dist/index.js and one for prosemirror-transform@1.7.3/dist/index.cjs. This is happening because prosemirror-transform has import condition pointing to index.js and require condition pointing to index.cjs. That export field means if the package was required, index.cjs should be used, and index.js when imported.

The two import / require paths are:

• src/main.ts --(import)--> prosemirror-transform@1.7.3/dist/index.js
• src/main.ts --(import)--> prosemirror-utils@0.9.6/dist/index.js --(require)--> prosemirror-state@1.4.3/dist/index.cjs --(require)--> prosemirror-transform@1.7.3/dist/index.cjs

In Vite 5, the resolution cache was mixed so prosemirror-state@1.4.3/dist/index.cjs --(require)--> prosemirror-transform@1.7.3/dist/index.cjs was prosemirror-state@1.4.3/dist/index.cjs --(require)--> prosemirror-transform@1.7.3/dist/index.js. This is incorrect, but reduced the bundle size.

The way to fix this is to add module condition to the exports field pointing to the same file with import condition for all prosemirror dependencies. Because prosemirror already has module field, it should be safe to add them.
If the module conditions are set, I guess the bundle size would be smaller than the result you had with Vite 5 as prosemirror-tables, prosemirror-model, prosemirror-state will be deduped.

[sapphi-red]

Some issues related to the module condition: webpack/webpack#11014, rollup/rollup#3514, evanw/esbuild#2417

[skovhus]

Thanks for looking into this and for the careful explanation. 👏🏼

NOTE: upgrading the library also solved the issue, just wanted to flag if this was in fact a regression in Vite 6