import { TanStackDevtools } from '@tanstack/react-devtools' import type { QueryClient } from '@tanstack/react-query' import { ReactQueryDevtoolsPanel } from '@tanstack/react-query-devtools' import { createRootRouteWithContext, HeadContent, Scripts, } from '@tanstack/react-router' import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools' import type { ReactNode } from 'react' import { ErrorComponent } from '@/components/Error' import { NotFoundComponent } from '@/components/NotFount' import appCss from '@/styles.css?url' export interface RouterContext { queryClient: QueryClient } export const Route = createRootRouteWithContext()({ head: () => ({ meta: [ { charSet: 'utf-8', }, { name: 'viewport', content: 'width=device-width, initial-scale=1', }, { title: 'Fullstack Starter', }, ], links: [ { rel: 'stylesheet', href: appCss, }, ], }), shellComponent: RootDocument, errorComponent: () => , notFoundComponent: () => , }) function RootDocument({ children }: Readonly<{ children: ReactNode }>) { return ( {children} , }, { name: 'TanStack Query', render: , }, ]} /> ) }