react routing_error ai_generated true

Error: No routes matched location "/some/path"

ID: react/react-router-no-match

Also available as: JSON · Markdown
92%Fix Rate
94%Confidence
160Evidence
2022-01-01First Seen

Version Compatibility

VersionStatusIntroducedDeprecatedNotes
18 active — — —

Root Cause

React Router v6 cannot find a matching route for the current URL. Common causes: missing catch-all route, incorrect path patterns, basename mismatch, or nested routes not using relative paths.

generic

Workarounds

  1. 93% success Add a catch-all route with path="*" that renders a 404 page 
    <Routes><Route path="/" element={<Home />} /><Route path="/about" element={<About />} /><Route path="*" element={<NotFound />} /></Routes>

    Sources: https://reactrouter.com/en/main/route/route#splats

  2. 90% success Ensure basename is set correctly on BrowserRouter when app is hosted at a subpath 
    <BrowserRouter basename="/my-app"><Routes>...</Routes></BrowserRouter>

    Sources: https://reactrouter.com/en/main/router-components/browser-router

  3. 88% success Use relative paths in nested routes instead of absolute paths 
    In nested routes, use path="settings" not path="/dashboard/settings". The parent route path is prepended automatically.

    Sources: https://reactrouter.com/en/main/start/concepts#defining-routes

Dead Ends

Common approaches that don't work:

  1. Redirect all unmatched routes to the home page 55% fail

    Hides navigation bugs and broken links. Users land on the wrong page silently with no indication that their intended URL was invalid.

  2. Use exact prop on Route components (React Router v5 pattern) 80% fail

    React Router v6 removed the exact prop; all routes match exactly by default. Using exact has no effect and the real issue is elsewhere.

Error Chain

Leads to:
Preceded by:
Frequently confused with: