Failing to install `@react-router/dev` using `yarn` with Node.js version v20.12.2 due to Vite 7 release

[alanko0511]

Vite 7 was just released a few hours ago (https://vite.dev/blog/announcing-vite7) and it drops support on Node.js versions < 20.19.

I'm using React Router as a...

framework

Reproduction

1. Fork this repo: https://github.com/alanko0511/rr7-dev-yarn-version (it's a minimal vite@6.3.5 app)
2. Use Node.js version manager like fnm to switch the Node.js version to 20.12.2
3. Run yarn install using the classic yarn (v1.22.22)
4. You should see the following error:

error vite@7.0.0: The engine "node" is incompatible with this module. Expected version "^20.19.0 || >=22.12.0". Got "20.12.2"
error Found incompatible module.

System Info

$ npx envinfo --system --npmPackages '{vite,react-router,@react-router/*}' --binaries --browsers

  System:
    OS: macOS 13.0
    CPU: (12) arm64 Apple M2 Pro
    Memory: 89.42 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 20.12.2 - ~/.local/state/fnm_multishells/54581_1750774976394/bin/node
    Yarn: 1.22.22 - /opt/homebrew/bin/yarn
    npm: 10.5.0 - ~/.local/state/fnm_multishells/54581_1750774976394/bin/npm
  Browsers:
    Chrome: 137.0.7151.120
    Safari: 16.1
  npmPackages:
    @react-router/dev: ^7.6.2 => 7.6.2 
    @react-router/fs-routes: ^7.6.2 => 7.6.2 
    @react-router/node: ^7.6.2 => 7.6.2 
    @react-router/serve: ^7.6.2 => 7.6.2 
    react-router: ^7.6.2 => 7.6.2 
    vite: ^6.3.5 => 6.3.5

Used Package Manager

yarn

Expected Behavior

yarn install should be successful.

Actual Behavior

yarn install fails with the following error:

error vite@7.0.0: The engine "node" is incompatible with this module. Expected version "^20.19.0 || >=22.12.0". Got "20.12.2"
error Found incompatible module.

Since I have some environments that require the use of node@20.12.2 and yarn@1.22.22, I can't easily upgrade these two versions. To get around this, I have to add a resolutions to the package.json:

  "resolutions": {
    "vite": "^6.3.5"
  }

When I switch to node@20.19.3 to have a successful yarn install, then run yarn why vite, it seems that @react-router/dev doesn't strictly lock the version of vite-node, allowing it to install the latest version of vite:

$ yarn why vite
yarn why v1.22.22
[1/4] 🤔  Why do we have the module "vite"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] 🔍  Finding dependency...
[4/4] 🚡  Calculating file sizes...
=> Found "vite@6.3.5"
info Has been hoisted to "vite"
info This module exists because it's specified in "devDependencies".
info Disk size without dependencies: "2.66MB"
info Disk size with unique dependencies: "6.24MB"
info Disk size with transitive dependencies: "6.6MB"
info Number of shared dependencies: 8
=> Found "vite-node#vite@7.0.0"
info This module exists because "@react-router#dev#vite-node" depends on it.
info Disk size without dependencies: "2.31MB"
info Disk size with unique dependencies: "5.89MB"
info Disk size with transitive dependencies: "6.25MB"
info Number of shared dependencies: 8
✨  Done in 0.10s.

[hyusetiawan]

having this issue as well, locking it to Vite 6 works

[airhorns]

vite-node newer than 3.2.0 happily depends on vite 7, so I think if react-router wanted to be helpful out of the box, it could depend on a max of vite-node<=3.1.0 until react-router is compatible with vite 7 itself. This is the commit that relaxed the vite-node dep: vitest-dev/vitest@1716b61

Also of note -- this version dep means that right now installing react router installs two versions of vite.

[brophdawg11]

We added support for Vite 7 in #13748 which will be in our next release - you can try that out in 7.6.3-pre.0 currently and see if that works as expected.

As for the node 20.12 issue - I'm unsure if there's anything for us to do there? We don't want to lock into an older version of vite-node that would prevent folks from using vite 7. And everything works as expected on current versions of node 20, so it's just a problem specifically with outdated version of a Node Maintenance LTS release and has a relatively easy workaround via resolutions as mentioned in the description above. That seems like a sufficient solution IMO.

[airhorns]

You could consider publishing a minor release first that does restrict the vite-node dependency to vite 6 only, and then land vite 7 support throughout react router in a second release. That would allow folks to restrict their version dependency if they are stuck on vite 6 for a while yet instead of always getting a mixed bag. IMO resolutions is a pretty ugly workaround because it requires someone figuring out that all this is going on in the first place and locking a transitive dependency version which is always a bit spooky.