[Bug]: No matching exports error when creating a new framework project using default template

[sriverag]

What version of React Router are you using?

7.0.2

Steps to Reproduce

1. Create project using npx create-react-router@latest --template remix-run/react-router-templates/default my-project with all defaults. (Y to all prompts)
2. cd'ed into my-project folder.
3. Ran npm run dev

Expected Behavior

The app to build successfully.

Actual Behavior

Getting the following error:

✘ [ERROR] No matching export in "node_modules/react-router/dist/development/index.mjs" for import "UNSAFE_detectErrorBoundary"

    ../../node_modules/react-router-dom/dist/index.js:12:9:
      12 │ import { UNSAFE_detectErrorBoundary, Router, UNSAFE_NavigationContext, useHref...
         ╵          ~~~~~~~~~~~~~~~~~~~~~~~~~~

✘ [ERROR] No matching export in "node_modules/react-router/dist/development/index.mjs" for import "unstable_useBlocker"

    ../../node_modules/react-router-dom/dist/index.js:12:214:
      12 │ ... useMatches, useNavigation, unstable_useBlocker, UNSAFE_DataRouterContext }...
         ╵                                ~~~~~~~~~~~~~~~~~~~

✘ [ERROR] No matching export in "node_modules/react-router/dist/development/index.mjs" for import "AbortedDeferredError"

    ../../node_modules/react-router-dom/dist/index.js:13:9:
      13 │ export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, ...
         ╵          ~~~~~~~~~~~~~~~~~~~~

✘ [ERROR] No matching export in "node_modules/react-router/dist/development/index.mjs" for import "defer"

    ../../node_modules/react-router-dom/dist/index.js:13:337:
      13 │ ...hildren, createRoutesFromElements, defer, generatePath, isRouteErrorRespons...
         ╵                                       ~~~~~

✘ [ERROR] No matching export in "node_modules/react-router/dist/development/index.mjs" for import "json"

    ../../node_modules/react-router-dom/dist/index.js:13:380:
      13 │ ...generatePath, isRouteErrorResponse, json, matchPath, matchRoutes, parsePath...
         ╵                                        ~~~~

✘ [ERROR] No matching export in "node_modules/react-router/dist/development/index.mjs" for import "unstable_useBlocker"

    ../../node_modules/react-router-dom/dist/index.js:13:459:
      13 │ ...renderMatches, resolvePath, unstable_useBlocker, useActionData, useAsyncErr...
         ╵                                ~~~~~~~~~~~~~~~~~~~

[sadin999]

Add: react-router-dom@7.0.1 (if using 7.0.1) explicitly. e.g. npm install react-router-dom@7.0.1

[sriverag]

@sadin999 - Thank you! This worked.

[aisiklar]

Thanks @sadin999 and @sriverag
I had the same problem (#12414) and this solved my problem too. Just wondering, this seems to be not so common. Why some have it some some don't. Why do we have to explicitly install react-router-dom? If anyone knows?

[wovalle]

Can confirm this is still broken.

Just created a new default app npm create react-router

Tried npm run dev and got the same errors.

Ran npm i react-router-dom@latest

Tried the dev server again, worked flawlessly.