Facing imports issue while using the compat package

[prarabdhb]

Hi, I was trying to use the compat package to migrate from v5 to v6.

As soon as I install the package, I see errors like this

Compiled with problems:

WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'Navigate' (reexported as 'Navigate') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'NavigationType' (reexported as 'NavigationType') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'Outlet' (reexported as 'Outlet') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'Routes' (reexported as 'Routes') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'UNSAFE_LocationContext' (reexported as 'UNSAFE_LocationContext') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'UNSAFE_NavigationContext' (reexported as 'UNSAFE_NavigationContext') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'UNSAFE_RouteContext' (reexported as 'UNSAFE_RouteContext') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'createPath' (reexported as 'createPath') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'createRoutesFromChildren' (reexported as 'createRoutesFromChildren') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'matchRoutes' (reexported as 'matchRoutes') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'parsePath' (reexported as 'parsePath') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'renderMatches' (reexported as 'renderMatches') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'resolvePath' (reexported as 'resolvePath') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'useHref' (reexported as 'useHref') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'useInRouterContext' (reexported as 'useInRouterContext') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'useMatch' (reexported as 'useMatch') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'useNavigate' (reexported as 'useNavigate') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'useNavigationType' (reexported as 'useNavigationType') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'useOutlet' (reexported as 'useOutlet') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'useOutletContext' (reexported as 'useOutletContext') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'useResolvedPath' (reexported as 'useResolvedPath') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 14:0-439

export 'useRoutes' (reexported as 'useRoutes') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 184:13-20

export 'useHref' (imported as 'useHref') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 231:13-28

export 'useResolvedPath' (imported as 'useResolvedPath') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 290:17-28

export 'useNavigate' (imported as 'useNavigate') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 292:13-28

export 'useResolvedPath' (imported as 'useResolvedPath') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 301:37-47

export 'createPath' (imported as 'createPath') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 301:62-72

export 'createPath' (imported as 'createPath') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 331:17-28

export 'useNavigate' (imported as 'useNavigate') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 377:36-42

export 'Routes' (imported as 'Routes') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 401:32-38

export 'Routes' (imported as 'Routes') was not found in 'react-router' (possible exports: MemoryRouter, Prompt, Redirect, Route, Router, StaticRouter, Switch, __HistoryContext, __RouterContext, generatePath, matchPath, useHistory, useLocation, useParams, useRouteMatch, withRouter)


WARNING in ../node_modules/react-router-dom-v5-compat/index.js 422:15-25

export 'Action' (imported as 'Action') was not found in 'history' (possible exports: createBrowserHistory, createHashHistory, createLocation, createMemoryHistory, createPath, locationsAreEqual, parsePath)

My current package.json looks something like this

"react-router": "^5.2.0",
"react-router-dom": "^5.2.0",
"react-router-dom-v5-compat": "^6.3.0",

And the imports I am trying to use are

import {
	useNavigate,
	useParams,
	useMatch,
	useLocation as loc,
	CompatRoute
} from "react-router-dom-v5-compat";

Couldn't find any issues related to this on Github Issues or Discussions

[cato]

Did you find an answer to this @prarabdhb? I'm having the exact same issue.

[faq885]

Same issue on 2025

[tonywang402]

I guess your webpack config cause this issue.
You may need to add the relative path before the absolute path in resolve.modules of webpack config.

https://webpack.js.org/configuration/resolve/#resolvemodules

[faq885]

did not solved it for me

[faq885]

Same issue here on Feb 17, 2025

"react-router-dom": "5.3.4",
"react-router-dom-v5-compat": "^6.29.0",
"react-dom": "18.3.1",
"react": "18.3.1",

[onx2]

Bump, this is happening to me as well using vite.

"react-router": "^5.1.2",
"react-router-dom": "^5.1.2",
"react-router-dom-v5-compat": "6.30.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",