import { TanStackRouterDevtools } from '@tanstack/react-router-devtools' import * as React from 'react' import { HeadContent, Link, Outlet, Scripts, createRootRouteWithContext, } from '@tanstack/react-router' import type { RouterContext } from '../routerContext' export const Route = createRootRouteWithContext<RouterContext>()({ head: () => ({ links: [{ rel: 'icon', href: '/images/favicon.ico' }], meta: [ { title: 'TanStack Router SSR Basic File Based Streaming', }, { charSet: 'UTF-8', }, { name: 'viewport', content: 'width=device-width, initial-scale=1.0', }, ], scripts: [ { src: 'https://unpkg.com/@tailwindcss/browser@4', }, ...(!import.meta.env.PROD ? [ { type: 'module', children: `import RefreshRuntime from "/@react-refresh" RefreshRuntime.injectIntoGlobalHook(window) window.$RefreshReg$ = () => {} window.$RefreshSig$ = () => (type) => type window.__vite_plugin_react_preamble_installed__ = true`, }, { type: 'module', src: '/@vite/client', }, ] : []), { type: 'module', src: import.meta.env.PROD ? '/static/entry-client.js' : '/src/entry-client.tsx', }, ], }), component: RootComponent, }) function RootComponent() { return ( <html lang="en"> <head> <HeadContent /> </head> <body> <div className="p-2 flex gap-2 text-lg"> <Link to="/" activeProps={{ className: 'font-bold', }} activeOptions={{ exact: true }} > Home </Link>{' '} <Link to="/posts" activeProps={{ className: 'font-bold', }} > Posts </Link>{' '} <Link to="/error" activeProps={{ className: 'font-bold', }} > Error </Link> </div> <hr /> <Outlet /> {/* Start rendering router matches */} <TanStackRouterDevtools position="bottom-right" /> <Scripts /> </body> </html> ) } import { TanStackRouterDevtools } from '@tanstack/react-router-devtools' import * as React from 'react' import { HeadContent, Link, Outlet, Scripts, createRootRouteWithContext, } from '@tanstack/react-router' import type { RouterContext } from '../routerContext' export const Route = createRootRouteWithContext<RouterContext>()({ head: () => ({ links: [{ rel: 'icon', href: '/images/favicon.ico' }], meta: [ { title: 'TanStack Router SSR Basic File Based Streaming', }, { charSet: 'UTF-8', }, { name: 'viewport', content: 'width=device-width, initial-scale=1.0', }, ], scripts: [ { src: 'https://unpkg.com/@tailwindcss/browser@4', }, ...(!import.meta.env.PROD ? [ { type: 'module', children: `import RefreshRuntime from "/@react-refresh" RefreshRuntime.injectIntoGlobalHook(window) window.$RefreshReg$ = () => {} window.$RefreshSig$ = () => (type) => type window.__vite_plugin_react_preamble_installed__ = true`, }, { type: 'module', src: '/@vite/client', }, ] : []), { type: 'module', src: import.meta.env.PROD ? '/static/entry-client.js' : '/src/entry-client.tsx', }, ], }), component: RootComponent, }) function RootComponent() { return ( <html lang="en"> <head> <HeadContent /> </head> <body> <div className="p-2 flex gap-2 text-lg"> <Link to="/" activeProps={{ className: 'font-bold', }} activeOptions={{ exact: true }} > Home </Link>{' '} <Link to="/posts" activeProps={{ className: 'font-bold', }} > Posts </Link>{' '} <Link to="/error" activeProps={{ className: 'font-bold', }} > Error </Link> </div> <hr /> <Outlet /> {/* Start rendering router matches */} <TanStackRouterDevtools position="bottom-right" /> <Scripts /> </body> </html> ) } Your weekly dose of JavaScript news. Delivered every Monday to over 100,000 devs, for free.
Your weekly dose of JavaScript news. Delivered every Monday to over 100,000 devs, for free.
