How to create a "root" layout?
I was looking through the various TSR examples and noticed several that had
Based on my understanding of the
Am I correct in assuming that code from
I was hoping to use the
__root.tsx file as well as an _layout.tsx file in the root of the /routes directory, such as in the Kitchen Sink example https://tanstack.com/router/latest/docs/framework/react/examples/kitchen-sink-react-query-file-basedBased on my understanding of the
_layout routes, I was expecting the JSX in /routes/_layout.tsx to be rendered by the __root Outlet even on the index page, but that doesnt seem to be the case. Am I correct in assuming that code from
/routes/_layout.tsx file will only render for nested routes and wont actually apply to the root? In other words, the only components that will match on the root are whatever is in /routes/__root.tsx and /routes/index.tsx?I was hoping to use the
/routes/_layout.tsx file to contain the actual UI layout for the entire app, and then I would just keep the /routes/__root.tsx file as a place to perform JS logic and render and necessary providers. But it looks like i might need to put both my JS logic and the app layout into that root.tsx file. Not a huge deal if thats the case, I just wanted to make sure Im not misunderstanding layout routesAn example showing how to implement Kitchen Sink React Query File Based in React using TanStack Router.
