Fix Cannot resolve symbol 'Routes': stale JetBrains typings

TL;DR#

Cannot resolve symbol 'Routes' in WebStorm, PyCharm, PhpStorm or IntelliJ IDEA, with react-router-dom 6 installed, is an IDE problem, not a project problem. The IDE downloads type definitions for some popular libraries into its own system folder and was reading a react-router-dom 5 copy from there instead of the types in your node_modules. Version 5 has no Routes. Open the Registry, remove react-router-dom from typescript.external.type.definitions.packages, close the IDE, delete <system directory>/javascript/typings/react-router-dom, then run File | Invalidate Caches with "Clear file system cache and Local History" ticked.

The inspection, as the original Stack Overflow question and the JetBrains reports show it:

Cannot resolve symbol 'Routes'

The import that triggers it is the standard React Router 6 one:

import { Routes, Route, BrowserRouter } from 'react-router-dom';

Why the IDE cannot see Routes#

React Router 6 ships its own TypeScript declarations. The package's package.json points its types field at ./index.d.ts, and that file re-exports Routes, Route, Navigate, Outlet and the hooks from react-router. A plain tsc run resolves react-router-dom to that file and finds Routes without any help.

JetBrains IDEs add a second source of types. In reply to WEB-54259 on JetBrains' issue tracker, Oksana Chumak explained the mechanism:

The IDE downloads typings for some popular libraries to its configuration folder and uses them to enhance code completion.

For react-router-dom, the copy it downloaded was the community @types/react-router-dom package, which describes React Router 5. The reporter of WEB-53756 (WebStorm 2021.2, Windows) found the IDE reading ...\JetBrains\WebStorm2021.2\javascript\typings\react-router-dom\5.3.2\node_modules\@types\react-router-dom rather than the project's node_modules, and noted that the code compiled and ran without errors. The second answer on the Stack Overflow question shows the same path, and the IntelliJ report WEB-54659 says that Ctrl+click on Route and Link would "link to a folder that is clearly versioned at 5.x".

Version 5 typings cannot know about Routes. The official upgrade guide from v5 says it plainly: "React Router v6 introduces a Routes component that is kind of like Switch". The npm registry still lists @types/react-router-dom with 5.3.3 as its latest release, and that release's index.d.ts does not mention Routes either. Installing it does not help: it is the same kind of file the IDE was already reading.

What the stale typings do to a type checker#

The JetBrains inspection itself was not reproduced here. The type-level mechanism was reproduced on 24 October 2026 in a Docker container with Node 22.23.3: a project with React 17.0.2, react-router-dom 6.0.2 and TypeScript 4.5.2 was type-checked twice. The first run used a tsconfig paths entry to send react-router-dom to a copy of @types/react-router-dom 5.3.2, standing in for the IDE's typings folder:

App.tsx(1,10): error TS2724: '"react-router-dom"' has no exported member named 'Routes'. Did you mean 'Route'?

The same run also rejected element on <Route>, which matches the missing element completion the WEB-53756 reporter described:

      Property 'element' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Route<{}, "/">> & Readonly<RouteProps<"/", {}> & OmitNative<{}, keyof RouteProps<...>>> & Readonly<...>'.

The 5.3.2 index.d.ts contains the word Routes zero times. Removing that override, and changing nothing else, let the compiler resolve the package's own declarations and the check passed:

exit=0
/w/node_modules/react-router-dom/index.d.ts

A control run in the same container confirmed that the runtime package is fine. require('react-router-dom') on 6.0.2 printed:

typeof Routes = function | typeof Switch = undefined

So the error lives entirely in which declaration file the editor reads. Your bundler never sees the IDE's typings folder.

Fix: stop the IDE using its own react-router-dom typings#

Steps 2 and 3 come from JetBrains' replies on YouTrack; step 4 comes from the accepted Stack Overflow answer. The order needs a word. The replies on WEB-54259, WEB-54106 and WEB-54952 say to delete the downloaded typings and then change the Registry. The later reply on WEB-61249 puts the Registry first, then closing the IDE and deleting the folder. That is the order used below, for a reason the reporters give: on WEB-53756 and WEB-54106 the deleted folder came back, and on WEB-54952 a user found the error returned after clearing the folder alone, and stayed gone only after removing the Registry entry first and clearing the folder again.

1. Confirm the diagnosis. Ctrl+click (Cmd+click on macOS) 'react-router-dom' in the import. The editor may offer more than one index.d.ts, as the second Stack Overflow answer found. If the list of targets includes a path under javascript/typings/react-router-dom/5.x, this article applies.

2. Change the Registry key. Open Help | Find Action, type Registry... and open it (pressing Shift twice and searching for "registry" also works, as the accepted answer describes). Find typescript.external.type.definitions.packages and delete only react-router-dom from its comma-separated value. The same JetBrains replies offer a broader alternative: disable the typescript.external.type.definitions key itself. Note the spelling: the accepted Stack Overflow answer writes "defintions", while the JetBrains replies spell the key definitions.

3. Close the IDE and delete the downloaded copy. The typings live under the IDE's system directory, documented in Directories used by the IDE. Replace WebStorm2021.2 with your product and version:

# Windows (PowerShell)
Remove-Item -Recurse -Force "$env:LOCALAPPDATA\JetBrains\WebStorm2021.2\javascript\typings\react-router-dom"

# macOS
rm -rf ~/Library/Caches/JetBrains/WebStorm2021.2/javascript/typings/react-router-dom
 
# Linux
rm -rf ~/.cache/JetBrains/WebStorm2021.2/javascript/typings/react-router-dom

4. Invalidate the caches. Start the IDE, open File | Invalidate Caches, tick "Clear file system cache and Local History" and click Invalidate and Restart. The Invalidate caches page explains that this option removes the virtual file system cache along with Local History, so commit or save anything you rely on Local History for first.

The original question came from PyCharm, and the JetBrains reports cover WebStorm, PhpStorm and IntelliJ IDEA with the same Registry key and the same javascript/typings folder; only the product name in the path changes.

Verify the fix#

• Ctrl+click 'react-router-dom' in the import again. It should now open node_modules/react-router-dom/index.d.ts, the file whose types field the package declares.
• The red underline on Routes should disappear, since the file the IDE now reads exports it, and element on <Route> should stop being flagged.
• Restart the IDE once more and wait for indexing to finish. If the 5.x folder reappears under javascript/typings, check that react-router-dom is really gone from the Registry key's value, then delete the folder again.

From the terminal you can confirm that the project itself was never broken:

npm ls react-router-dom
node -e "console.log(typeof require('react-router-dom').Routes)"

The first command should list a 6.x version and the second should print function.

Where the IDE fix stops and a real error starts#

The Stack Overflow asker also wrote "My frontend is blank". The inspection cannot cause that: it changes nothing in what the bundler builds, as the control run above shows. For a blank page, look at the browser console instead. One runtime error that v5-style route code throws on version 6 is A <Route> is only ever to be used as the child of <Routes> element; if that is what the console shows, continue with the Route-outside-Routes fix, which also covers moving pages onto the element prop. Version 6 also exports no Switch, as the control output shows, so code that still imports it needs the same migration.

If tsc on the command line, not just the IDE, reports that react-router-dom has no exported member, the stale types are inside the project. Look for an old @types/react-router-dom in package.json, a paths or typeRoots entry pointing at it, and see the TS2305 guide, which treats @types drifting from the runtime package as one of its causes. A paths alias only redirects the type checker, never the emitted code; the tsconfig paths runtime guide explains why Node still fails on an alias that tsc accepts.

VS Code users hit the sibling of this problem when the editor uses a different TypeScript than the project, which is the cause behind the --jsx flag error that survives a correct tsconfig. Both cases have the same shape: the build is right, the editor is reading something else.

The JetBrains reports behind this fix span WebStorm 2021.2, PhpStorm 2021.3, IntelliJ IDEA 2021.3 and, in WEB-61249, WebStorm 2023.1, where the JetBrains reply named both react-dom and react-router-dom as packages to remove from the key. Whatever the version, the test is the same Ctrl+click: if it lands in the IDE's typings folder rather than node_modules, take the package out of the Registry key before you delete the folder, or the old declarations will simply be downloaded again.