ambitious-aqua

Devtools - Uncaught Error: Invariant failed

Does anyone have an idea why I'm getting that error when using the router dev tools. I followed the documentation BTW and I'm using react 18.2.0

11 Replies

correct-apricot•3y ago

I've looked into the source code and it seems like you aren't mounting the Devtools under the RouterProvider. You need to either mount in inside, so it can access router instance from context. Or pass it manually as prop

correct-apricot•3y ago

This is the exact error you're facing https://github.com/TanStack/router/blob/8814f47ba42a2db5ba6a909e54ccdbd4138317b9/packages/router-devtools/src/devtools.tsx#L512

GitHub

router/packages/router-devtools/src/devtools.tsx at 8814f47ba42a2db...

🤖 Type-safe router w/ built-in caching & URL state management for React, Preact, and friends - TanStack/router

ambitious-aquaOP•3y ago

I saw that previously I passed my router to it but still the same error. I don't think I need to pass my router to it, It's on the same level as my outlet

correct-apricot•3y ago

Hmm, that's strange. Is your Devtools and router packages version in sync?

ambitious-aquaOP•3y ago

export const rootRoute = new RootRoute({
  component: function () {
    return (
      <>
        <Outlet />
        <TanStackRouterDevtools />
      </>
    );
  },
});

export const rootRoute = new RootRoute({
  component: function () {
    return (
      <>
        <Outlet />
        <TanStackRouterDevtools />
      </>
    );
  },
});

Yes I made sure they are in sync

correct-apricot•3y ago

Hmm then I don't have more ideas, sorry

ambitious-aquaOP•3y ago

stormy-gold•3y ago

Try with the latest now

absent-sapphire•3y ago

I am facing the same issue and had pass router instance manually: <TanStackRouterDevtools router={router} />

foreign-sapphire•3y ago

i working around by using this to get the router

import { routerContext } from "@tanstack/react-router";
const router = useContext(routerContext);

Gaming

Programming

Devtools - Uncaught Error: Invariant failed

Did you find this page helpful?