Skip to content

Dual package hazard with module-sync condition in Node v22.12+ #7692

@markdalgleish

Description

@markdalgleish

Describe the bug

Vitest doesn't honour the module-sync condition that Node v22.12+ uses, leading to a dual package hazard.

This issue came up in the context of React Router when testing alongside a library with a peer dependency on React Router. Original issue is here: remix-run/react-router#12785

React Router's exports field looks like this:

"exports": {
  ".": {
    "node": {
      "types": "./dist/development/index.d.ts",      
      "module-sync": "./dist/development/index.mjs",
      "default": "./dist/development/index.js"
    },
    "import": {
      "types": "./dist/development/index.d.mts",
      "default": "./dist/development/index.mjs"
    },
    "default": {
      "types": "./dist/development/index.d.ts",
      "default": "./dist/development/index.js"
    }
  },
}

Importing React Router in Vitest loads the default CJS build.

In Node v22.12+, importing React Router loads the module-sync ESM build.

This leads to multiple mismatched versions of React Router being loaded, breaking React context since the context provider and hooks are coming from different builds.

For context, there's also an issue for implementing this in Vite itself, but I'm raising it here to track the status, and in case additional work is needed here: vitejs/vite#19201. The workaround provided below differs from the fix described in the Vite issue, so it's possible more work will be needed in Vitest.

We experienced the same issue with Vite but were able to implement a fix within the React Router Vite plugin, however this plugin isn't designed for test usage.

Reproduction

https://github.com/acelaya/peer-react-router-vitest
(Reproduction originally provided in React Router issue: remix-run/react-router#12785)

This reproduction can be fixed by adding the following to the Vite config:

  resolve: {
    conditions: ["module-sync"],
  },

System Info

System:
    OS: macOS 15.3.2
    CPU: (12) arm64 Apple M4 Pro
    Memory: 1.24 GB / 48.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.14.0 - ~/.nvm/versions/node/v22.14.0/bin/node
    npm: 10.9.2 - ~/.nvm/versions/node/v22.14.0/bin/npm
    pnpm: 9.15.0 - ~/Library/pnpm/pnpm
    bun: 1.0.1 - ~/.bun/bin/bun
  Browsers:
    Chrome: 133.0.6943.54
    Edge: 134.0.3124.68
    Firefox Nightly: 122.0a1
    Safari: 18.3.1
  npmPackages:
    @vitejs/plugin-react: ^4.3.4 => 4.3.4 
    vite: ^6.0.5 => 6.0.8 
    vitest: ^3.0.2 => 3.0.2

Used Package Manager

npm

Validations

Metadata

Metadata

Assignees

No one assigned

    Labels

    p3-minor-bugAn edge case that only affects very specific usage (priority)

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions