sensitive-blue

How to do non-nested routes with virtual file routes?

The documentation teaches how to make non-nested routes using the file/folder names, but there is no instruction to do the same using virtual file routes I thought that only the children of a route declared in the first parameter were considered nested, but sibling routes with the same path are still considered children These two work the same:

export const routes = rootRoute("__root.tsx", [
  index("page.tsx"),
  route("about", "about/layout.tsx", [route("me", "about/me/page.tsx")]),
  route("about/you", "about/you/page.tsx"),
]);

export const routes = rootRoute("__root.tsx", [
  index("page.tsx"),
  route("about", "about/layout.tsx", [route("me", "about/me/page.tsx")]),
  route("about/you", "about/you/page.tsx"),
]);

export const routes = rootRoute("__root.tsx", [
  index("page.tsx"),
  route("about", "about/layout.tsx", [
    route("me", "about/me/page.tsx"),
    route("you", "about/you/page.tsx")
  ]),
]);

export const routes = rootRoute("__root.tsx", [
  index("page.tsx"),
  route("about", "about/layout.tsx", [
    route("me", "about/me/page.tsx"),
    route("you", "about/you/page.tsx")
  ]),
]);

6 Replies

wise-white•2mo ago

can you provide a complete example by forking one of the existing stackblitz examples please?

sensitive-blueOP•2mo ago

https://codesandbox.io/p/github/Thiagolino8/router_repro/main?file=%2Fsrc%2Froutes.tsx

wise-white•2mo ago

so how else would it work? i think this is working as intended would you expect that about/you does not inherit the about/layout.tsx?

sensitive-blueOP•2mo ago

Yes, actually yes What is the point of the child routes array if it makes no difference whether the routes are in there or not? But regardless of whether it works that way or not, is there any way to make non-nested routes using the virtual file routes?

wise-white•2mo ago

might be a bug if I think more about it. can you please create a GitHub issue for further investigation?

sensitive-blueOP•2mo ago

Sure https://github.com/TanStack/router/issues/4584

GitHub

Routes remain nested even outside the child routes array · Issue #...

Which project does this relate to? Router Describe the bug Routes remain nested even outside the child routes array in the virtual file routes API These two behave the same way: export const routes...

Gaming

Programming

How to do non-nested routes with virtual file routes?

Did you find this page helpful?