pnpm: Cannot find package '@babel/types'

[The-Lone-Druid]

Which project does this relate to?

Router

Describe the bug

When I run pnpm run dev, I get an error that the @tanstack/router-plugin cannot find the @babel/types package, even though the @tanstack/router-pljgin has @babel/types installed as a dev dependency. This seems to be related to how pnpm structures the node_modules directory but I am not sure, I need help on this one as I also tried manually installing @babe/types.

Your Example Website or App

https://github.com/The-Lone-Druid/vite-react-boilerplate-tankstank

Steps to Reproduce the Bug or Issue

Clone [link to your repository]
2. Run pnpm install
3. Run pnpm run dev

Expected behavior

The development server should start without errors.

Screenshots or Videos

Platform

• OS: [e.g. macOS, Windows, Linux]
• Browser: [e.g. Chrome, Safari, Firefox]
• Version: [e.g. 91.1]

Additional context

OS: Windows 11
Node.js: latest LTS

• pnpm: latest
• @tanstack/router-plugin: 1.95.0
• @tanstack/react-router: 1.95.0
• vite: 5.4.2
• react: 18.3.1

[The-Lone-Druid]

pnpm Workaround: @babel/types Resolution

For those encountering the "Cannot find package '@babel/types'" error when using pnpm with @tanstack/router-plugin, the following workaround has proven effective:

1. Adjust .npmrc settings:

   Add or modify the following lines in your project's .npmrc file:

auto-install-peers=true
strict-peer-dependencies=false

• auto-install-peers=true: This automatically installs peer dependencies, ensuring @babel/types is present.
• strict-peer-dependencies=false: This makes pnpm less strict about peer dependency version requirements, potentially resolving conflicts.

2. Clean Reinstall:

• Run pnpm store prune to clear the pnpm store.
• Delete your node_modules directory.
• Remove your pnpm-lock.yaml file.
• Run pnpm install to reinstall all dependencies.

This clean reinstall helps ensure that no cached or stale dependencies are causing conflicts.

Explanation

These steps address the unique way pnpm manages dependencies. We can resolve the module resolution issues that lead to the @babel/types error by automatically installing peer dependencies and relaxing version restrictions. The clean reinstall further ensures a fresh dependency tree, minimizing the chances of conflicts.

Note: As specified, this is just a workaround, and I don't believe it to be an actual solution. The reason could be that I'm missing some core information about how pnpm works. It will be much better if someone from the Tanstack team or contributors have a good idea on what the actual issue was and is this the right solution or not.