[{"data":1,"prerenderedAt":2435},["ShallowReactive",2],{"navigation":3,"examples-nav":393,"-examples-vite-ssr-react":494,"-examples-vite-ssr-react-surround":2432},[4,88,217,223,378,390],{"title":5,"path":6,"stem":7,"children":8,"icon":87},"","/docs","1.docs/1.index",[9,12,17,22,27,32,37,42,47,52,57,62,67,72,77,82],{"title":10,"path":6,"stem":7,"icon":11},"Introduction","i-lucide-compass",{"title":13,"path":14,"stem":15,"icon":16},"Quick Start","/docs/quick-start","1.docs/2.quick-start","i-lucide-zap",{"title":18,"path":19,"stem":20,"icon":21},"Renderer","/docs/renderer","1.docs/4.renderer","ri:layout-masonry-line",{"title":23,"path":24,"stem":25,"icon":26},"Routing","/docs/routing","1.docs/5.routing","ri:direction-line",{"title":28,"path":29,"stem":30,"icon":31},"Assets","/docs/assets","1.docs/50.assets","ri:image-2-line",{"title":33,"path":34,"stem":35,"icon":36},"Configuration","/docs/configuration","1.docs/50.configuration","ri:settings-3-line",{"title":38,"path":39,"stem":40,"icon":41},"Database","/docs/database","1.docs/50.database","ri:database-2-line",{"title":43,"path":44,"stem":45,"icon":46},"Lifecycle","/docs/lifecycle","1.docs/50.lifecycle","i-lucide-layers",{"title":48,"path":49,"stem":50,"icon":51},"Plugins","/docs/plugins","1.docs/50.plugins","ri:plug-line",{"title":53,"path":54,"stem":55,"icon":56},"Tasks","/docs/tasks","1.docs/50.tasks","codicon:run-all",{"title":58,"path":59,"stem":60,"icon":61},"WebSocket","/docs/websocket","1.docs/50.websocket","ri:broadcast-fill",{"title":63,"path":64,"stem":65,"icon":66},"Server Entry","/docs/server-entry","1.docs/6.server-entry","ri:server-line",{"title":68,"path":69,"stem":70,"icon":71},"Cache","/docs/cache","1.docs/7.cache","ri:speed-line",{"title":73,"path":74,"stem":75,"icon":76},"KV Storage","/docs/storage","1.docs/8.storage","carbon:datastore",{"title":78,"path":79,"stem":80,"icon":81},"Migration Guide","/docs/migration","1.docs/99.migration","ri:arrow-right-up-line",{"title":83,"path":84,"stem":85,"icon":86},"Nightly Channel","/docs/nightly","1.docs/99.nightly","ri:moon-fill","i-lucide-book-open",{"title":89,"path":90,"stem":91,"children":92,"icon":94},"Deploy","/deploy","2.deploy/0.index",[93,95,116],{"title":89,"path":90,"stem":91,"icon":94},"ri:upload-cloud-2-line",{"title":96,"path":97,"stem":98,"children":99,"page":115},"Runtimes","/deploy/runtimes","2.deploy/10.runtimes",[100,105,110],{"title":101,"path":102,"stem":103,"icon":104},"Node.js","/deploy/runtimes/node","2.deploy/10.runtimes/1.node","akar-icons:node-fill",{"title":106,"path":107,"stem":108,"icon":109},"Bun","/deploy/runtimes/bun","2.deploy/10.runtimes/bun","simple-icons:bun",{"title":111,"path":112,"stem":113,"icon":114},"Deno","/deploy/runtimes/deno","2.deploy/10.runtimes/deno","simple-icons:deno",false,{"title":117,"path":118,"stem":119,"children":120,"page":115},"Providers","/deploy/providers","2.deploy/20.providers",[121,125,129,133,137,141,145,149,153,157,161,165,169,173,177,181,185,189,193,197,201,205,209,213],{"title":122,"path":123,"stem":124},"Alwaysdata","/deploy/providers/alwaysdata","2.deploy/20.providers/alwaysdata",{"title":126,"path":127,"stem":128},"AWS Lambda","/deploy/providers/aws","2.deploy/20.providers/aws",{"title":130,"path":131,"stem":132},"AWS Amplify","/deploy/providers/aws-amplify","2.deploy/20.providers/aws-amplify",{"title":134,"path":135,"stem":136},"Azure","/deploy/providers/azure","2.deploy/20.providers/azure",{"title":138,"path":139,"stem":140},"Cleavr","/deploy/providers/cleavr","2.deploy/20.providers/cleavr",{"title":142,"path":143,"stem":144},"Cloudflare","/deploy/providers/cloudflare","2.deploy/20.providers/cloudflare",{"title":146,"path":147,"stem":148},"Deno Deploy","/deploy/providers/deno-deploy","2.deploy/20.providers/deno-deploy",{"title":150,"path":151,"stem":152},"DigitalOcean","/deploy/providers/digitalocean","2.deploy/20.providers/digitalocean",{"title":154,"path":155,"stem":156},"Firebase","/deploy/providers/firebase","2.deploy/20.providers/firebase",{"title":158,"path":159,"stem":160},"Flightcontrol","/deploy/providers/flightcontrol","2.deploy/20.providers/flightcontrol",{"title":162,"path":163,"stem":164},"Genezio","/deploy/providers/genezio","2.deploy/20.providers/genezio",{"title":166,"path":167,"stem":168},"GitHub Pages","/deploy/providers/github-pages","2.deploy/20.providers/github-pages",{"title":170,"path":171,"stem":172},"GitLab Pages","/deploy/providers/gitlab-pages","2.deploy/20.providers/gitlab-pages",{"title":174,"path":175,"stem":176},"Heroku","/deploy/providers/heroku","2.deploy/20.providers/heroku",{"title":178,"path":179,"stem":180},"IIS","/deploy/providers/iis","2.deploy/20.providers/iis",{"title":182,"path":183,"stem":184},"Koyeb","/deploy/providers/koyeb","2.deploy/20.providers/koyeb",{"title":186,"path":187,"stem":188},"Netlify","/deploy/providers/netlify","2.deploy/20.providers/netlify",{"title":190,"path":191,"stem":192},"Platform.sh","/deploy/providers/platform-sh","2.deploy/20.providers/platform-sh",{"title":194,"path":195,"stem":196},"Render.com","/deploy/providers/render","2.deploy/20.providers/render",{"title":198,"path":199,"stem":200},"StormKit","/deploy/providers/stormkit","2.deploy/20.providers/stormkit",{"title":202,"path":203,"stem":204},"Vercel","/deploy/providers/vercel","2.deploy/20.providers/vercel",{"title":206,"path":207,"stem":208},"Zeabur","/deploy/providers/zeabur","2.deploy/20.providers/zeabur",{"title":210,"path":211,"stem":212},"Zephyr Cloud","/deploy/providers/zephyr","2.deploy/20.providers/zephyr",{"title":214,"path":215,"stem":216},"Zerops","/deploy/providers/zerops","2.deploy/20.providers/zerops",{"title":218,"path":219,"stem":220,"children":221,"icon":36},"Config","/config","3.config/0.index",[222],{"title":218,"path":219,"stem":220,"icon":36},{"title":224,"path":225,"stem":226,"children":227,"icon":229},"Examples","/examples","4.examples/0.index",[228,230,235,240,245,250,254,259,264,269,274,279,284,288,293,297,301,306,311,316,321,326,331,336,341,346,350,355,360,364,369,374],{"title":224,"path":225,"stem":226,"icon":229},"i-lucide-folder-code",{"title":231,"path":232,"stem":233,"icon":234},"API Routes","/examples/api-routes","4.examples/api-routes","i-lucide-route",{"title":236,"path":237,"stem":238,"icon":239},"Auto Imports","/examples/auto-imports","4.examples/auto-imports","i-lucide-import",{"title":241,"path":242,"stem":243,"icon":244},"Cached Handler","/examples/cached-handler","4.examples/cached-handler","i-lucide-clock",{"title":246,"path":247,"stem":248,"icon":249},"Custom Error Handler","/examples/custom-error-handler","4.examples/custom-error-handler","i-lucide-alert-circle",{"title":38,"path":251,"stem":252,"icon":253},"/examples/database","4.examples/database","i-lucide-database",{"title":255,"path":256,"stem":257,"icon":258},"Elysia","/examples/elysia","4.examples/elysia","i-skill-icons-elysia-dark",{"title":260,"path":261,"stem":262,"icon":263},"Express","/examples/express","4.examples/express","i-simple-icons-express",{"title":265,"path":266,"stem":267,"icon":268},"Fastify","/examples/fastify","4.examples/fastify","i-simple-icons-fastify",{"title":270,"path":271,"stem":272,"icon":273},"Hello World","/examples/hello-world","4.examples/hello-world","i-lucide-sparkles",{"title":275,"path":276,"stem":277,"icon":278},"Hono","/examples/hono","4.examples/hono","i-logos-hono",{"title":280,"path":281,"stem":282,"icon":283},"Import Alias","/examples/import-alias","4.examples/import-alias","i-lucide-at-sign",{"title":285,"path":286,"stem":287,"icon":46},"Middleware","/examples/middleware","4.examples/middleware",{"title":289,"path":290,"stem":291,"icon":292},"Mono JSX","/examples/mono-jsx","4.examples/mono-jsx","i-lucide-brackets",{"title":294,"path":295,"stem":296,"icon":292},"Nano JSX","/examples/nano-jsx","4.examples/nano-jsx",{"title":48,"path":298,"stem":299,"icon":300},"/examples/plugins","4.examples/plugins","i-lucide-plug",{"title":302,"path":303,"stem":304,"icon":305},"Custom Renderer","/examples/renderer","4.examples/renderer","i-lucide-code",{"title":307,"path":308,"stem":309,"icon":310},"Runtime Config","/examples/runtime-config","4.examples/runtime-config","i-lucide-settings",{"title":312,"path":313,"stem":314,"icon":315},"Server Fetch","/examples/server-fetch","4.examples/server-fetch","i-lucide-arrow-right-left",{"title":317,"path":318,"stem":319,"icon":320},"Shiki","/examples/shiki","4.examples/shiki","i-lucide-highlighter",{"title":322,"path":323,"stem":324,"icon":325},"Virtual Routes","/examples/virtual-routes","4.examples/virtual-routes","i-lucide-box",{"title":327,"path":328,"stem":329,"icon":330},"Vite Nitro Plugin","/examples/vite-nitro-plugin","4.examples/vite-nitro-plugin","i-logos-vitejs",{"title":332,"path":333,"stem":334,"icon":335},"Vite RSC","/examples/vite-rsc","4.examples/vite-rsc","i-logos-react",{"title":337,"path":338,"stem":339,"icon":340},"Vite SSR HTML","/examples/vite-ssr-html","4.examples/vite-ssr-html","i-logos-html-5",{"title":342,"path":343,"stem":344,"icon":345},"SSR with Preact","/examples/vite-ssr-preact","4.examples/vite-ssr-preact","i-logos-preact",{"title":347,"path":348,"stem":349,"icon":335},"SSR with React","/examples/vite-ssr-react","4.examples/vite-ssr-react",{"title":351,"path":352,"stem":353,"icon":354},"SSR with SolidJS","/examples/vite-ssr-solid","4.examples/vite-ssr-solid","i-logos-solidjs-icon",{"title":356,"path":357,"stem":358,"icon":359},"SSR with TanStack Router","/examples/vite-ssr-tsr-react","4.examples/vite-ssr-tsr-react","i-simple-icons-tanstack",{"title":361,"path":362,"stem":363,"icon":359},"SSR with TanStack Start","/examples/vite-ssr-tss-react","4.examples/vite-ssr-tss-react",{"title":365,"path":366,"stem":367,"icon":368},"SSR with Vue Router","/examples/vite-ssr-vue-router","4.examples/vite-ssr-vue-router","i-logos-vue",{"title":370,"path":371,"stem":372,"icon":373},"Vite + tRPC","/examples/vite-trpc","4.examples/vite-trpc","i-simple-icons-trpc",{"title":58,"path":375,"stem":376,"icon":377},"/examples/websocket","4.examples/websocket","i-lucide-radio",{"title":379,"path":380,"stem":381,"children":382},"Blog","/blog","9.blog",[383,386],{"title":379,"path":380,"stem":384,"icon":385},"9.blog/index","i-lucide-file-text",{"title":387,"path":388,"stem":389,"icon":385},"Nitro v3 Beta is here!","/blog/v3-beta","9.blog/1.v3-beta",{"title":5,"path":391,"stem":392},"/","index",[394,399,403,406,409,412,416,419,422,425,428,431,434,438,441,444,447,450,453,457,460,464,467,470,473,476,479,482,485,488,491],{"title":231,"description":395,"meta":396,"path":232},"File-based API routing with HTTP method support and dynamic parameters.",{"automd":397,"category":398,"icon":234},true,"features",{"title":236,"description":400,"meta":401,"path":237},"Automatic imports for utilities and composables.",{"automd":397,"category":402,"icon":239},"config",{"title":241,"description":404,"meta":405,"path":242},"Cache route responses with configurable bypass logic.",{"automd":397,"category":398,"icon":244},{"title":246,"description":407,"meta":408,"path":247},"Customize error responses with a global error handler.",{"automd":397,"category":398,"icon":249},{"title":38,"description":410,"meta":411,"path":251},"Built-in database support with SQL template literals.",{"automd":397,"category":398,"icon":253},{"title":255,"description":413,"meta":414,"path":256},"Integrate Elysia with Nitro using the server entry.",{"automd":397,"category":415,"icon":258},"backend frameworks",{"title":260,"description":417,"meta":418,"path":261},"Integrate Express with Nitro using the server entry.",{"automd":397,"category":415,"icon":263},{"title":265,"description":420,"meta":421,"path":266},"Integrate Fastify with Nitro using the server entry.",{"automd":397,"category":415,"icon":268},{"title":270,"description":423,"meta":424,"path":271},"Minimal Nitro server using the web standard fetch handler.",{"automd":397,"category":398,"icon":273},{"title":275,"description":426,"meta":427,"path":276},"Integrate Hono with Nitro using the server entry.",{"automd":397,"category":415,"icon":278},{"title":280,"description":429,"meta":430,"path":281},"Custom import aliases for cleaner module paths.",{"automd":397,"category":402,"icon":283},{"title":285,"description":432,"meta":433,"path":286},"Request middleware for authentication, logging, and request modification.",{"automd":397,"category":398,"icon":46},{"title":289,"description":435,"meta":436,"path":290},"Server-side JSX rendering in Nitro with mono-jsx.",{"automd":397,"category":437,"icon":292},"server side rendering",{"title":294,"description":439,"meta":440,"path":295},"Server-side JSX rendering in Nitro with nano-jsx.",{"automd":397,"category":437,"icon":292},{"title":48,"description":442,"meta":443,"path":298},"Extend Nitro with custom plugins for hooks and lifecycle events.",{"automd":397,"category":398,"icon":300},{"title":302,"description":445,"meta":446,"path":303},"Build a custom HTML renderer in Nitro with server-side data fetching.",{"automd":397,"category":437,"icon":305},{"title":307,"description":448,"meta":449,"path":308},"Environment-aware configuration with runtime access.",{"automd":397,"category":402,"icon":310},{"title":312,"description":451,"meta":452,"path":313},"Internal server-to-server requests without network overhead.",{"automd":397,"category":398,"icon":315},{"title":317,"description":454,"meta":455,"path":318},"Server-side syntax highlighting in Nitro with Shiki.",{"automd":397,"category":456,"icon":320},"integrations",{"title":322,"description":458,"meta":459,"path":323},"Define routes programmatically using Nitro's virtual module system.",{"automd":397,"category":398,"icon":325},{"title":327,"description":461,"meta":462,"path":328},"Use Nitro as a Vite plugin for programmatic configuration.",{"automd":397,"category":463,"icon":330},"vite",{"title":332,"description":465,"meta":466,"path":333},"React Server Components with Vite and Nitro.",{"automd":397,"category":463,"icon":335},{"title":337,"description":468,"meta":469,"path":338},"Server-side rendering with vanilla HTML, Vite, and Nitro.",{"automd":397,"category":437,"icon":340},{"title":342,"description":471,"meta":472,"path":343},"Server-side rendering with Preact in Nitro using Vite.",{"automd":397,"category":437,"icon":345},{"title":347,"description":474,"meta":475,"path":348},"Server-side rendering with React in Nitro using Vite.",{"automd":397,"category":437,"icon":335},{"title":351,"description":477,"meta":478,"path":352},"Server-side rendering with SolidJS in Nitro using Vite.",{"automd":397,"category":437,"icon":354},{"title":356,"description":480,"meta":481,"path":357},"Client-side routing with TanStack Router in Nitro using Vite.",{"automd":397,"category":437,"icon":359},{"title":361,"description":483,"meta":484,"path":362},"Full-stack React with TanStack Start in Nitro using Vite.",{"automd":397,"category":437,"icon":359},{"title":365,"description":486,"meta":487,"path":366},"Server-side rendering with Vue Router in Nitro using Vite.",{"automd":397,"category":437,"icon":368},{"title":370,"description":489,"meta":490,"path":371},"End-to-end typesafe APIs with tRPC in Nitro using Vite.",{"automd":397,"category":463,"icon":373},{"title":58,"description":492,"meta":493,"path":375},"Real-time bidirectional communication with WebSocket support.",{"automd":397,"category":398,"icon":377},{"id":495,"title":347,"body":496,"description":474,"extension":2427,"meta":2428,"navigation":2429,"path":348,"seo":2430,"stem":349,"__hash__":2431},"content/4.examples/vite-ssr-react.md",{"type":497,"value":498,"toc":2419,"icon":335},"minimark",[499,1649,1653,1658,1675,1679,1686,1780,1795,1799,1802,1932,1936,1943,2297,2320,2324,2327,2389,2398,2402,2415],[500,501,504,713,772,898,1073,1151,1592],"code-tree",{":expand-all":502,"default-value":503},"true","src/entry-server.tsx",[505,506,511],"pre",{"className":507,"code":508,"filename":509,"language":510,"meta":5,"style":5},"language-json shiki shiki-themes github-light github-dark github-dark","{\n  \"type\": \"module\",\n  \"scripts\": {\n    \"build\": \"vite build\",\n    \"preview\": \"vite preview\",\n    \"dev\": \"vite dev\"\n  },\n  \"devDependencies\": {\n    \"@types/react\": \"^19.2.14\",\n    \"@types/react-dom\": \"^19.2.3\",\n    \"@vitejs/plugin-react\": \"^6.0.1\",\n    \"nitro\": \"latest\",\n    \"react\": \"^19.2.4\",\n    \"react-dom\": \"^19.2.4\",\n    \"react-refresh\": \"^0.18.0\",\n    \"vite\": \"latest\"\n  }\n}\n","package.json","json",[512,513,514,523,540,549,562,575,586,592,600,613,626,639,652,665,677,690,701,707],"code",{"__ignoreMap":5},[515,516,519],"span",{"class":517,"line":518},"line",1,[515,520,522],{"class":521},"slsVL","{\n",[515,524,526,530,533,537],{"class":517,"line":525},2,[515,527,529],{"class":528},"suiK_","  \"type\"",[515,531,532],{"class":521},": ",[515,534,536],{"class":535},"sfrk1","\"module\"",[515,538,539],{"class":521},",\n",[515,541,543,546],{"class":517,"line":542},3,[515,544,545],{"class":528},"  \"scripts\"",[515,547,548],{"class":521},": {\n",[515,550,552,555,557,560],{"class":517,"line":551},4,[515,553,554],{"class":528},"    \"build\"",[515,556,532],{"class":521},[515,558,559],{"class":535},"\"vite build\"",[515,561,539],{"class":521},[515,563,565,568,570,573],{"class":517,"line":564},5,[515,566,567],{"class":528},"    \"preview\"",[515,569,532],{"class":521},[515,571,572],{"class":535},"\"vite preview\"",[515,574,539],{"class":521},[515,576,578,581,583],{"class":517,"line":577},6,[515,579,580],{"class":528},"    \"dev\"",[515,582,532],{"class":521},[515,584,585],{"class":535},"\"vite dev\"\n",[515,587,589],{"class":517,"line":588},7,[515,590,591],{"class":521},"  },\n",[515,593,595,598],{"class":517,"line":594},8,[515,596,597],{"class":528},"  \"devDependencies\"",[515,599,548],{"class":521},[515,601,603,606,608,611],{"class":517,"line":602},9,[515,604,605],{"class":528},"    \"@types/react\"",[515,607,532],{"class":521},[515,609,610],{"class":535},"\"^19.2.14\"",[515,612,539],{"class":521},[515,614,616,619,621,624],{"class":517,"line":615},10,[515,617,618],{"class":528},"    \"@types/react-dom\"",[515,620,532],{"class":521},[515,622,623],{"class":535},"\"^19.2.3\"",[515,625,539],{"class":521},[515,627,629,632,634,637],{"class":517,"line":628},11,[515,630,631],{"class":528},"    \"@vitejs/plugin-react\"",[515,633,532],{"class":521},[515,635,636],{"class":535},"\"^6.0.1\"",[515,638,539],{"class":521},[515,640,642,645,647,650],{"class":517,"line":641},12,[515,643,644],{"class":528},"    \"nitro\"",[515,646,532],{"class":521},[515,648,649],{"class":535},"\"latest\"",[515,651,539],{"class":521},[515,653,655,658,660,663],{"class":517,"line":654},13,[515,656,657],{"class":528},"    \"react\"",[515,659,532],{"class":521},[515,661,662],{"class":535},"\"^19.2.4\"",[515,664,539],{"class":521},[515,666,668,671,673,675],{"class":517,"line":667},14,[515,669,670],{"class":528},"    \"react-dom\"",[515,672,532],{"class":521},[515,674,662],{"class":535},[515,676,539],{"class":521},[515,678,680,683,685,688],{"class":517,"line":679},15,[515,681,682],{"class":528},"    \"react-refresh\"",[515,684,532],{"class":521},[515,686,687],{"class":535},"\"^0.18.0\"",[515,689,539],{"class":521},[515,691,693,696,698],{"class":517,"line":692},16,[515,694,695],{"class":528},"    \"vite\"",[515,697,532],{"class":521},[515,699,700],{"class":535},"\"latest\"\n",[515,702,704],{"class":517,"line":703},17,[515,705,706],{"class":521},"  }\n",[515,708,710],{"class":517,"line":709},18,[515,711,712],{"class":521},"}\n",[505,714,717],{"className":507,"code":715,"filename":716,"language":510,"meta":5,"style":5},"{\n  \"extends\": \"nitro/tsconfig\",\n  \"compilerOptions\": {\n    \"jsx\": \"react-jsx\",\n    \"jsxImportSource\": \"react\"\n  }\n}\n","tsconfig.json",[512,718,719,723,735,742,754,764,768],{"__ignoreMap":5},[515,720,721],{"class":517,"line":518},[515,722,522],{"class":521},[515,724,725,728,730,733],{"class":517,"line":525},[515,726,727],{"class":528},"  \"extends\"",[515,729,532],{"class":521},[515,731,732],{"class":535},"\"nitro/tsconfig\"",[515,734,539],{"class":521},[515,736,737,740],{"class":517,"line":542},[515,738,739],{"class":528},"  \"compilerOptions\"",[515,741,548],{"class":521},[515,743,744,747,749,752],{"class":517,"line":551},[515,745,746],{"class":528},"    \"jsx\"",[515,748,532],{"class":521},[515,750,751],{"class":535},"\"react-jsx\"",[515,753,539],{"class":521},[515,755,756,759,761],{"class":517,"line":564},[515,757,758],{"class":528},"    \"jsxImportSource\"",[515,760,532],{"class":521},[515,762,763],{"class":535},"\"react\"\n",[515,765,766],{"class":517,"line":577},[515,767,706],{"class":521},[515,769,770],{"class":517,"line":588},[515,771,712],{"class":521},[505,773,778],{"className":774,"code":775,"filename":776,"language":777,"meta":5,"style":5},"language-js shiki shiki-themes github-light github-dark github-dark","import { defineConfig } from \"vite\";\nimport { nitro } from \"nitro/vite\";\nimport react from \"@vitejs/plugin-react\";\n\nexport default defineConfig({\n  plugins: [nitro(), react()],\n  environments: {\n    client: {\n      build: { rollupOptions: { input: \"./src/entry-client.tsx\" } },\n    },\n  },\n});\n","vite.config.mjs","js",[512,779,780,798,812,826,831,846,863,868,873,884,889,893],{"__ignoreMap":5},[515,781,782,786,789,792,795],{"class":517,"line":518},[515,783,785],{"class":784},"so5gQ","import",[515,787,788],{"class":521}," { defineConfig } ",[515,790,791],{"class":784},"from",[515,793,794],{"class":535}," \"vite\"",[515,796,797],{"class":521},";\n",[515,799,800,802,805,807,810],{"class":517,"line":525},[515,801,785],{"class":784},[515,803,804],{"class":521}," { nitro } ",[515,806,791],{"class":784},[515,808,809],{"class":535}," \"nitro/vite\"",[515,811,797],{"class":521},[515,813,814,816,819,821,824],{"class":517,"line":542},[515,815,785],{"class":784},[515,817,818],{"class":521}," react ",[515,820,791],{"class":784},[515,822,823],{"class":535}," \"@vitejs/plugin-react\"",[515,825,797],{"class":521},[515,827,828],{"class":517,"line":551},[515,829,830],{"emptyLinePlaceholder":397},"\n",[515,832,833,836,839,843],{"class":517,"line":564},[515,834,835],{"class":784},"export",[515,837,838],{"class":784}," default",[515,840,842],{"class":841},"shcOC"," defineConfig",[515,844,845],{"class":521},"({\n",[515,847,848,851,854,857,860],{"class":517,"line":577},[515,849,850],{"class":521},"  plugins: [",[515,852,853],{"class":841},"nitro",[515,855,856],{"class":521},"(), ",[515,858,859],{"class":841},"react",[515,861,862],{"class":521},"()],\n",[515,864,865],{"class":517,"line":588},[515,866,867],{"class":521},"  environments: {\n",[515,869,870],{"class":517,"line":594},[515,871,872],{"class":521},"    client: {\n",[515,874,875,878,881],{"class":517,"line":602},[515,876,877],{"class":521},"      build: { rollupOptions: { input: ",[515,879,880],{"class":535},"\"./src/entry-client.tsx\"",[515,882,883],{"class":521}," } },\n",[515,885,886],{"class":517,"line":615},[515,887,888],{"class":521},"    },\n",[515,890,891],{"class":517,"line":628},[515,892,591],{"class":521},[515,894,895],{"class":517,"line":641},[515,896,897],{"class":521},"});\n",[505,899,904],{"className":900,"code":901,"filename":902,"language":903,"meta":5,"style":5},"language-tsx shiki shiki-themes github-light github-dark github-dark","import { useState } from \"react\";\n\nexport function App() {\n  const [count, setCount] = useState(0);\n  return (\n    \u003C>\n      \u003Ch1 className=\"hero\">Nitro + Vite + React\u003C/h1>\n      \u003Cbutton onClick={() => setCount((c) => c + 1)}>Count is {count}\u003C/button>\n    \u003C/>\n  );\n}\n","src/app.tsx","tsx",[512,905,906,920,924,937,972,980,985,1010,1059,1064,1069],{"__ignoreMap":5},[515,907,908,910,913,915,918],{"class":517,"line":518},[515,909,785],{"class":784},[515,911,912],{"class":521}," { useState } ",[515,914,791],{"class":784},[515,916,917],{"class":535}," \"react\"",[515,919,797],{"class":521},[515,921,922],{"class":517,"line":525},[515,923,830],{"emptyLinePlaceholder":397},[515,925,926,928,931,934],{"class":517,"line":542},[515,927,835],{"class":784},[515,929,930],{"class":784}," function",[515,932,933],{"class":841}," App",[515,935,936],{"class":521},"() {\n",[515,938,939,942,945,948,951,954,957,960,963,966,969],{"class":517,"line":551},[515,940,941],{"class":784},"  const",[515,943,944],{"class":521}," [",[515,946,947],{"class":528},"count",[515,949,950],{"class":521},", ",[515,952,953],{"class":528},"setCount",[515,955,956],{"class":521},"] ",[515,958,959],{"class":784},"=",[515,961,962],{"class":841}," useState",[515,964,965],{"class":521},"(",[515,967,968],{"class":528},"0",[515,970,971],{"class":521},");\n",[515,973,974,977],{"class":517,"line":564},[515,975,976],{"class":784},"  return",[515,978,979],{"class":521}," (\n",[515,981,982],{"class":517,"line":577},[515,983,984],{"class":521},"    \u003C>\n",[515,986,987,990,994,997,999,1002,1005,1007],{"class":517,"line":588},[515,988,989],{"class":521},"      \u003C",[515,991,993],{"class":992},"sByVh","h1",[515,995,996],{"class":841}," className",[515,998,959],{"class":784},[515,1000,1001],{"class":535},"\"hero\"",[515,1003,1004],{"class":521},">Nitro + Vite + React\u003C/",[515,1006,993],{"class":992},[515,1008,1009],{"class":521},">\n",[515,1011,1012,1014,1017,1020,1022,1025,1028,1031,1034,1038,1041,1043,1046,1049,1052,1055,1057],{"class":517,"line":594},[515,1013,989],{"class":521},[515,1015,1016],{"class":992},"button",[515,1018,1019],{"class":841}," onClick",[515,1021,959],{"class":784},[515,1023,1024],{"class":521},"{() ",[515,1026,1027],{"class":784},"=>",[515,1029,1030],{"class":841}," setCount",[515,1032,1033],{"class":521},"((",[515,1035,1037],{"class":1036},"sQHwn","c",[515,1039,1040],{"class":521},") ",[515,1042,1027],{"class":784},[515,1044,1045],{"class":521}," c ",[515,1047,1048],{"class":784},"+",[515,1050,1051],{"class":528}," 1",[515,1053,1054],{"class":521},")}>Count is {count}\u003C/",[515,1056,1016],{"class":992},[515,1058,1009],{"class":521},[515,1060,1061],{"class":517,"line":602},[515,1062,1063],{"class":521},"    \u003C/>\n",[515,1065,1066],{"class":517,"line":615},[515,1067,1068],{"class":521},"  );\n",[515,1070,1071],{"class":517,"line":628},[515,1072,712],{"class":521},[505,1074,1077],{"className":900,"code":1075,"filename":1076,"language":903,"meta":5,"style":5},"import \"@vitejs/plugin-react/preamble\";\nimport { hydrateRoot } from \"react-dom/client\";\nimport { App } from \"./app.tsx\";\n\nhydrateRoot(document.querySelector(\"#app\")!, \u003CApp />);\n","src/entry-client.tsx",[512,1078,1079,1088,1102,1116,1120],{"__ignoreMap":5},[515,1080,1081,1083,1086],{"class":517,"line":518},[515,1082,785],{"class":784},[515,1084,1085],{"class":535}," \"@vitejs/plugin-react/preamble\"",[515,1087,797],{"class":521},[515,1089,1090,1092,1095,1097,1100],{"class":517,"line":525},[515,1091,785],{"class":784},[515,1093,1094],{"class":521}," { hydrateRoot } ",[515,1096,791],{"class":784},[515,1098,1099],{"class":535}," \"react-dom/client\"",[515,1101,797],{"class":521},[515,1103,1104,1106,1109,1111,1114],{"class":517,"line":542},[515,1105,785],{"class":784},[515,1107,1108],{"class":521}," { App } ",[515,1110,791],{"class":784},[515,1112,1113],{"class":535}," \"./app.tsx\"",[515,1115,797],{"class":521},[515,1117,1118],{"class":517,"line":551},[515,1119,830],{"emptyLinePlaceholder":397},[515,1121,1122,1125,1128,1131,1133,1136,1139,1142,1145,1148],{"class":517,"line":564},[515,1123,1124],{"class":841},"hydrateRoot",[515,1126,1127],{"class":521},"(document.",[515,1129,1130],{"class":841},"querySelector",[515,1132,965],{"class":521},[515,1134,1135],{"class":535},"\"#app\"",[515,1137,1138],{"class":521},")",[515,1140,1141],{"class":784},"!",[515,1143,1144],{"class":521},", \u003C",[515,1146,1147],{"class":528},"App",[515,1149,1150],{"class":521}," />);\n",[505,1152,1154],{"className":900,"code":1153,"filename":503,"language":903,"meta":5,"style":5},"import \"./styles.css\";\nimport { renderToReadableStream } from \"react-dom/server.edge\";\nimport { App } from \"./app.tsx\";\n\nimport clientAssets from \"./entry-client?assets=client\";\nimport serverAssets from \"./entry-server?assets=ssr\";\n\nexport default {\n  async fetch(_req: Request) {\n    const assets = clientAssets.merge(serverAssets);\n    return new Response(\n      await renderToReadableStream(\n        \u003Chtml lang=\"en\">\n          \u003Chead>\n            \u003Cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n            {assets.css.map((attr: any) => (\n              \u003Clink key={attr.href} rel=\"stylesheet\" {...attr} />\n            ))}\n            {assets.js.map((attr: any) => (\n              \u003Clink key={attr.href} type=\"modulepreload\" {...attr} />\n            ))}\n            \u003Cscript type=\"module\" src={assets.entry} />\n          \u003C/head>\n          \u003Cbody id=\"app\">\n            \u003CApp />\n          \u003C/body>\n        \u003C/html>\n      ),\n      { headers: { \"Content-Type\": \"text/html;charset=utf-8\" } }\n    );\n  },\n};\n",[512,1155,1156,1165,1179,1191,1195,1209,1223,1227,1236,1258,1278,1292,1302,1320,1330,1357,1381,1414,1419,1441,1468,1473,1496,1506,1524,1533,1542,1552,1558,1575,1581,1586],{"__ignoreMap":5},[515,1157,1158,1160,1163],{"class":517,"line":518},[515,1159,785],{"class":784},[515,1161,1162],{"class":535}," \"./styles.css\"",[515,1164,797],{"class":521},[515,1166,1167,1169,1172,1174,1177],{"class":517,"line":525},[515,1168,785],{"class":784},[515,1170,1171],{"class":521}," { renderToReadableStream } ",[515,1173,791],{"class":784},[515,1175,1176],{"class":535}," \"react-dom/server.edge\"",[515,1178,797],{"class":521},[515,1180,1181,1183,1185,1187,1189],{"class":517,"line":542},[515,1182,785],{"class":784},[515,1184,1108],{"class":521},[515,1186,791],{"class":784},[515,1188,1113],{"class":535},[515,1190,797],{"class":521},[515,1192,1193],{"class":517,"line":551},[515,1194,830],{"emptyLinePlaceholder":397},[515,1196,1197,1199,1202,1204,1207],{"class":517,"line":564},[515,1198,785],{"class":784},[515,1200,1201],{"class":521}," clientAssets ",[515,1203,791],{"class":784},[515,1205,1206],{"class":535}," \"./entry-client?assets=client\"",[515,1208,797],{"class":521},[515,1210,1211,1213,1216,1218,1221],{"class":517,"line":577},[515,1212,785],{"class":784},[515,1214,1215],{"class":521}," serverAssets ",[515,1217,791],{"class":784},[515,1219,1220],{"class":535}," \"./entry-server?assets=ssr\"",[515,1222,797],{"class":521},[515,1224,1225],{"class":517,"line":588},[515,1226,830],{"emptyLinePlaceholder":397},[515,1228,1229,1231,1233],{"class":517,"line":594},[515,1230,835],{"class":784},[515,1232,838],{"class":784},[515,1234,1235],{"class":521}," {\n",[515,1237,1238,1241,1244,1246,1249,1252,1255],{"class":517,"line":602},[515,1239,1240],{"class":784},"  async",[515,1242,1243],{"class":841}," fetch",[515,1245,965],{"class":521},[515,1247,1248],{"class":1036},"_req",[515,1250,1251],{"class":784},":",[515,1253,1254],{"class":841}," Request",[515,1256,1257],{"class":521},") {\n",[515,1259,1260,1263,1266,1269,1272,1275],{"class":517,"line":615},[515,1261,1262],{"class":784},"    const",[515,1264,1265],{"class":528}," assets",[515,1267,1268],{"class":784}," =",[515,1270,1271],{"class":521}," clientAssets.",[515,1273,1274],{"class":841},"merge",[515,1276,1277],{"class":521},"(serverAssets);\n",[515,1279,1280,1283,1286,1289],{"class":517,"line":628},[515,1281,1282],{"class":784},"    return",[515,1284,1285],{"class":784}," new",[515,1287,1288],{"class":841}," Response",[515,1290,1291],{"class":521},"(\n",[515,1293,1294,1297,1300],{"class":517,"line":641},[515,1295,1296],{"class":784},"      await",[515,1298,1299],{"class":841}," renderToReadableStream",[515,1301,1291],{"class":521},[515,1303,1304,1307,1310,1313,1315,1318],{"class":517,"line":654},[515,1305,1306],{"class":521},"        \u003C",[515,1308,1309],{"class":992},"html",[515,1311,1312],{"class":841}," lang",[515,1314,959],{"class":784},[515,1316,1317],{"class":535},"\"en\"",[515,1319,1009],{"class":521},[515,1321,1322,1325,1328],{"class":517,"line":667},[515,1323,1324],{"class":521},"          \u003C",[515,1326,1327],{"class":992},"head",[515,1329,1009],{"class":521},[515,1331,1332,1335,1338,1341,1343,1346,1349,1351,1354],{"class":517,"line":679},[515,1333,1334],{"class":521},"            \u003C",[515,1336,1337],{"class":992},"meta",[515,1339,1340],{"class":841}," name",[515,1342,959],{"class":784},[515,1344,1345],{"class":535},"\"viewport\"",[515,1347,1348],{"class":841}," content",[515,1350,959],{"class":784},[515,1352,1353],{"class":535},"\"width=device-width, initial-scale=1.0\"",[515,1355,1356],{"class":521}," />\n",[515,1358,1359,1362,1365,1367,1370,1372,1375,1377,1379],{"class":517,"line":692},[515,1360,1361],{"class":521},"            {assets.css.",[515,1363,1364],{"class":841},"map",[515,1366,1033],{"class":521},[515,1368,1369],{"class":1036},"attr",[515,1371,1251],{"class":784},[515,1373,1374],{"class":528}," any",[515,1376,1040],{"class":521},[515,1378,1027],{"class":784},[515,1380,979],{"class":521},[515,1382,1383,1386,1389,1392,1394,1397,1400,1402,1405,1408,1411],{"class":517,"line":703},[515,1384,1385],{"class":521},"              \u003C",[515,1387,1388],{"class":992},"link",[515,1390,1391],{"class":841}," key",[515,1393,959],{"class":784},[515,1395,1396],{"class":521},"{attr.href} ",[515,1398,1399],{"class":841},"rel",[515,1401,959],{"class":784},[515,1403,1404],{"class":535},"\"stylesheet\"",[515,1406,1407],{"class":521}," {",[515,1409,1410],{"class":784},"...",[515,1412,1413],{"class":521},"attr} />\n",[515,1415,1416],{"class":517,"line":709},[515,1417,1418],{"class":521},"            ))}\n",[515,1420,1422,1425,1427,1429,1431,1433,1435,1437,1439],{"class":517,"line":1421},19,[515,1423,1424],{"class":521},"            {assets.js.",[515,1426,1364],{"class":841},[515,1428,1033],{"class":521},[515,1430,1369],{"class":1036},[515,1432,1251],{"class":784},[515,1434,1374],{"class":528},[515,1436,1040],{"class":521},[515,1438,1027],{"class":784},[515,1440,979],{"class":521},[515,1442,1444,1446,1448,1450,1452,1454,1457,1459,1462,1464,1466],{"class":517,"line":1443},20,[515,1445,1385],{"class":521},[515,1447,1388],{"class":992},[515,1449,1391],{"class":841},[515,1451,959],{"class":784},[515,1453,1396],{"class":521},[515,1455,1456],{"class":841},"type",[515,1458,959],{"class":784},[515,1460,1461],{"class":535},"\"modulepreload\"",[515,1463,1407],{"class":521},[515,1465,1410],{"class":784},[515,1467,1413],{"class":521},[515,1469,1471],{"class":517,"line":1470},21,[515,1472,1418],{"class":521},[515,1474,1476,1478,1481,1484,1486,1488,1491,1493],{"class":517,"line":1475},22,[515,1477,1334],{"class":521},[515,1479,1480],{"class":992},"script",[515,1482,1483],{"class":841}," type",[515,1485,959],{"class":784},[515,1487,536],{"class":535},[515,1489,1490],{"class":841}," src",[515,1492,959],{"class":784},[515,1494,1495],{"class":521},"{assets.entry} />\n",[515,1497,1499,1502,1504],{"class":517,"line":1498},23,[515,1500,1501],{"class":521},"          \u003C/",[515,1503,1327],{"class":992},[515,1505,1009],{"class":521},[515,1507,1509,1511,1514,1517,1519,1522],{"class":517,"line":1508},24,[515,1510,1324],{"class":521},[515,1512,1513],{"class":992},"body",[515,1515,1516],{"class":841}," id",[515,1518,959],{"class":784},[515,1520,1521],{"class":535},"\"app\"",[515,1523,1009],{"class":521},[515,1525,1527,1529,1531],{"class":517,"line":1526},25,[515,1528,1334],{"class":521},[515,1530,1147],{"class":528},[515,1532,1356],{"class":521},[515,1534,1536,1538,1540],{"class":517,"line":1535},26,[515,1537,1501],{"class":521},[515,1539,1513],{"class":992},[515,1541,1009],{"class":521},[515,1543,1545,1548,1550],{"class":517,"line":1544},27,[515,1546,1547],{"class":521},"        \u003C/",[515,1549,1309],{"class":992},[515,1551,1009],{"class":521},[515,1553,1555],{"class":517,"line":1554},28,[515,1556,1557],{"class":521},"      ),\n",[515,1559,1561,1564,1567,1569,1572],{"class":517,"line":1560},29,[515,1562,1563],{"class":521},"      { headers: { ",[515,1565,1566],{"class":535},"\"Content-Type\"",[515,1568,532],{"class":521},[515,1570,1571],{"class":535},"\"text/html;charset=utf-8\"",[515,1573,1574],{"class":521}," } }\n",[515,1576,1578],{"class":517,"line":1577},30,[515,1579,1580],{"class":521},"    );\n",[515,1582,1584],{"class":517,"line":1583},31,[515,1585,591],{"class":521},[515,1587,1589],{"class":517,"line":1588},32,[515,1590,1591],{"class":521},"};\n",[505,1593,1598],{"className":1594,"code":1595,"filename":1596,"language":1597,"meta":5,"style":5},"language-css shiki shiki-themes github-light github-dark github-dark",".hero {\n  color: orange;\n}\n\nbutton {\n  background-color: lightskyblue;\n}\n","src/styles.css","css",[512,1599,1600,1607,1619,1623,1627,1633,1645],{"__ignoreMap":5},[515,1601,1602,1605],{"class":517,"line":518},[515,1603,1604],{"class":841},".hero",[515,1606,1235],{"class":521},[515,1608,1609,1612,1614,1617],{"class":517,"line":525},[515,1610,1611],{"class":528},"  color",[515,1613,532],{"class":521},[515,1615,1616],{"class":528},"orange",[515,1618,797],{"class":521},[515,1620,1621],{"class":517,"line":542},[515,1622,712],{"class":521},[515,1624,1625],{"class":517,"line":551},[515,1626,830],{"emptyLinePlaceholder":397},[515,1628,1629,1631],{"class":517,"line":564},[515,1630,1016],{"class":992},[515,1632,1235],{"class":521},[515,1634,1635,1638,1640,1643],{"class":517,"line":577},[515,1636,1637],{"class":528},"  background-color",[515,1639,532],{"class":521},[515,1641,1642],{"class":528},"lightskyblue",[515,1644,797],{"class":521},[515,1646,1647],{"class":517,"line":588},[515,1648,712],{"class":521},[1650,1651,1652],"p",{},"Set up server-side rendering (SSR) with React, Vite, and Nitro. This setup enables streaming HTML responses, automatic asset management, and client hydration.",[1654,1655,1657],"h2",{"id":1656},"overview","Overview",[1659,1660,1662,1666,1669,1672],"steps",{"level":1661},"4",[1663,1664,1665],"h4",{},"Add the Nitro Vite plugin to your Vite config",[1663,1667,1668],{},"Configure client and server entry points",[1663,1670,1671],{},"Create a server entry that renders your app to HTML",[1663,1673,1674],{},"Create a client entry that hydrates the server-rendered HTML",[1654,1676,1678],{"id":1677},"_1-configure-vite","1. Configure Vite",[1650,1680,1681,1682,1685],{},"Add the Nitro and React plugins to your Vite config. Define the ",[512,1683,1684],{},"client"," environment with your client entry point:",[505,1687,1688],{"className":774,"code":775,"filename":776,"language":777,"meta":5,"style":5},[512,1689,1690,1702,1714,1726,1730,1740,1752,1756,1760,1768,1772,1776],{"__ignoreMap":5},[515,1691,1692,1694,1696,1698,1700],{"class":517,"line":518},[515,1693,785],{"class":784},[515,1695,788],{"class":521},[515,1697,791],{"class":784},[515,1699,794],{"class":535},[515,1701,797],{"class":521},[515,1703,1704,1706,1708,1710,1712],{"class":517,"line":525},[515,1705,785],{"class":784},[515,1707,804],{"class":521},[515,1709,791],{"class":784},[515,1711,809],{"class":535},[515,1713,797],{"class":521},[515,1715,1716,1718,1720,1722,1724],{"class":517,"line":542},[515,1717,785],{"class":784},[515,1719,818],{"class":521},[515,1721,791],{"class":784},[515,1723,823],{"class":535},[515,1725,797],{"class":521},[515,1727,1728],{"class":517,"line":551},[515,1729,830],{"emptyLinePlaceholder":397},[515,1731,1732,1734,1736,1738],{"class":517,"line":564},[515,1733,835],{"class":784},[515,1735,838],{"class":784},[515,1737,842],{"class":841},[515,1739,845],{"class":521},[515,1741,1742,1744,1746,1748,1750],{"class":517,"line":577},[515,1743,850],{"class":521},[515,1745,853],{"class":841},[515,1747,856],{"class":521},[515,1749,859],{"class":841},[515,1751,862],{"class":521},[515,1753,1754],{"class":517,"line":588},[515,1755,867],{"class":521},[515,1757,1758],{"class":517,"line":594},[515,1759,872],{"class":521},[515,1761,1762,1764,1766],{"class":517,"line":602},[515,1763,877],{"class":521},[515,1765,880],{"class":535},[515,1767,883],{"class":521},[515,1769,1770],{"class":517,"line":615},[515,1771,888],{"class":521},[515,1773,1774],{"class":517,"line":628},[515,1775,591],{"class":521},[515,1777,1778],{"class":517,"line":641},[515,1779,897],{"class":521},[1650,1781,1782,1783,1786,1787,1790,1791,1794],{},"The ",[512,1784,1785],{},"environments.client"," configuration tells Vite which file to use as the browser entry point. Nitro automatically detects the server entry from files named ",[512,1788,1789],{},"entry-server"," or ",[512,1792,1793],{},"server"," in common directories.",[1654,1796,1798],{"id":1797},"_2-create-the-app-component","2. Create the App Component",[1650,1800,1801],{},"Create a shared React component that runs on both server and client:",[505,1803,1804],{"className":900,"code":901,"filename":902,"language":903,"meta":5,"style":5},[512,1805,1806,1818,1822,1832,1856,1862,1866,1884,1920,1924,1928],{"__ignoreMap":5},[515,1807,1808,1810,1812,1814,1816],{"class":517,"line":518},[515,1809,785],{"class":784},[515,1811,912],{"class":521},[515,1813,791],{"class":784},[515,1815,917],{"class":535},[515,1817,797],{"class":521},[515,1819,1820],{"class":517,"line":525},[515,1821,830],{"emptyLinePlaceholder":397},[515,1823,1824,1826,1828,1830],{"class":517,"line":542},[515,1825,835],{"class":784},[515,1827,930],{"class":784},[515,1829,933],{"class":841},[515,1831,936],{"class":521},[515,1833,1834,1836,1838,1840,1842,1844,1846,1848,1850,1852,1854],{"class":517,"line":551},[515,1835,941],{"class":784},[515,1837,944],{"class":521},[515,1839,947],{"class":528},[515,1841,950],{"class":521},[515,1843,953],{"class":528},[515,1845,956],{"class":521},[515,1847,959],{"class":784},[515,1849,962],{"class":841},[515,1851,965],{"class":521},[515,1853,968],{"class":528},[515,1855,971],{"class":521},[515,1857,1858,1860],{"class":517,"line":564},[515,1859,976],{"class":784},[515,1861,979],{"class":521},[515,1863,1864],{"class":517,"line":577},[515,1865,984],{"class":521},[515,1867,1868,1870,1872,1874,1876,1878,1880,1882],{"class":517,"line":588},[515,1869,989],{"class":521},[515,1871,993],{"class":992},[515,1873,996],{"class":841},[515,1875,959],{"class":784},[515,1877,1001],{"class":535},[515,1879,1004],{"class":521},[515,1881,993],{"class":992},[515,1883,1009],{"class":521},[515,1885,1886,1888,1890,1892,1894,1896,1898,1900,1902,1904,1906,1908,1910,1912,1914,1916,1918],{"class":517,"line":594},[515,1887,989],{"class":521},[515,1889,1016],{"class":992},[515,1891,1019],{"class":841},[515,1893,959],{"class":784},[515,1895,1024],{"class":521},[515,1897,1027],{"class":784},[515,1899,1030],{"class":841},[515,1901,1033],{"class":521},[515,1903,1037],{"class":1036},[515,1905,1040],{"class":521},[515,1907,1027],{"class":784},[515,1909,1045],{"class":521},[515,1911,1048],{"class":784},[515,1913,1051],{"class":528},[515,1915,1054],{"class":521},[515,1917,1016],{"class":992},[515,1919,1009],{"class":521},[515,1921,1922],{"class":517,"line":602},[515,1923,1063],{"class":521},[515,1925,1926],{"class":517,"line":615},[515,1927,1068],{"class":521},[515,1929,1930],{"class":517,"line":628},[515,1931,712],{"class":521},[1654,1933,1935],{"id":1934},"_3-create-the-server-entry","3. Create the Server Entry",[1650,1937,1938,1939,1942],{},"The server entry renders your React app to a streaming HTML response. It uses ",[512,1940,1941],{},"react-dom/server.edge"," for edge-compatible streaming:",[505,1944,1945],{"className":900,"code":1153,"filename":503,"language":903,"meta":5,"style":5},[512,1946,1947,1955,1967,1979,1983,1995,2007,2011,2019,2035,2049,2059,2067,2081,2089,2109,2129,2153,2157,2177,2201,2205,2223,2231,2245,2253,2261,2269,2273,2285,2289,2293],{"__ignoreMap":5},[515,1948,1949,1951,1953],{"class":517,"line":518},[515,1950,785],{"class":784},[515,1952,1162],{"class":535},[515,1954,797],{"class":521},[515,1956,1957,1959,1961,1963,1965],{"class":517,"line":525},[515,1958,785],{"class":784},[515,1960,1171],{"class":521},[515,1962,791],{"class":784},[515,1964,1176],{"class":535},[515,1966,797],{"class":521},[515,1968,1969,1971,1973,1975,1977],{"class":517,"line":542},[515,1970,785],{"class":784},[515,1972,1108],{"class":521},[515,1974,791],{"class":784},[515,1976,1113],{"class":535},[515,1978,797],{"class":521},[515,1980,1981],{"class":517,"line":551},[515,1982,830],{"emptyLinePlaceholder":397},[515,1984,1985,1987,1989,1991,1993],{"class":517,"line":564},[515,1986,785],{"class":784},[515,1988,1201],{"class":521},[515,1990,791],{"class":784},[515,1992,1206],{"class":535},[515,1994,797],{"class":521},[515,1996,1997,1999,2001,2003,2005],{"class":517,"line":577},[515,1998,785],{"class":784},[515,2000,1215],{"class":521},[515,2002,791],{"class":784},[515,2004,1220],{"class":535},[515,2006,797],{"class":521},[515,2008,2009],{"class":517,"line":588},[515,2010,830],{"emptyLinePlaceholder":397},[515,2012,2013,2015,2017],{"class":517,"line":594},[515,2014,835],{"class":784},[515,2016,838],{"class":784},[515,2018,1235],{"class":521},[515,2020,2021,2023,2025,2027,2029,2031,2033],{"class":517,"line":602},[515,2022,1240],{"class":784},[515,2024,1243],{"class":841},[515,2026,965],{"class":521},[515,2028,1248],{"class":1036},[515,2030,1251],{"class":784},[515,2032,1254],{"class":841},[515,2034,1257],{"class":521},[515,2036,2037,2039,2041,2043,2045,2047],{"class":517,"line":615},[515,2038,1262],{"class":784},[515,2040,1265],{"class":528},[515,2042,1268],{"class":784},[515,2044,1271],{"class":521},[515,2046,1274],{"class":841},[515,2048,1277],{"class":521},[515,2050,2051,2053,2055,2057],{"class":517,"line":628},[515,2052,1282],{"class":784},[515,2054,1285],{"class":784},[515,2056,1288],{"class":841},[515,2058,1291],{"class":521},[515,2060,2061,2063,2065],{"class":517,"line":641},[515,2062,1296],{"class":784},[515,2064,1299],{"class":841},[515,2066,1291],{"class":521},[515,2068,2069,2071,2073,2075,2077,2079],{"class":517,"line":654},[515,2070,1306],{"class":521},[515,2072,1309],{"class":992},[515,2074,1312],{"class":841},[515,2076,959],{"class":784},[515,2078,1317],{"class":535},[515,2080,1009],{"class":521},[515,2082,2083,2085,2087],{"class":517,"line":667},[515,2084,1324],{"class":521},[515,2086,1327],{"class":992},[515,2088,1009],{"class":521},[515,2090,2091,2093,2095,2097,2099,2101,2103,2105,2107],{"class":517,"line":679},[515,2092,1334],{"class":521},[515,2094,1337],{"class":992},[515,2096,1340],{"class":841},[515,2098,959],{"class":784},[515,2100,1345],{"class":535},[515,2102,1348],{"class":841},[515,2104,959],{"class":784},[515,2106,1353],{"class":535},[515,2108,1356],{"class":521},[515,2110,2111,2113,2115,2117,2119,2121,2123,2125,2127],{"class":517,"line":692},[515,2112,1361],{"class":521},[515,2114,1364],{"class":841},[515,2116,1033],{"class":521},[515,2118,1369],{"class":1036},[515,2120,1251],{"class":784},[515,2122,1374],{"class":528},[515,2124,1040],{"class":521},[515,2126,1027],{"class":784},[515,2128,979],{"class":521},[515,2130,2131,2133,2135,2137,2139,2141,2143,2145,2147,2149,2151],{"class":517,"line":703},[515,2132,1385],{"class":521},[515,2134,1388],{"class":992},[515,2136,1391],{"class":841},[515,2138,959],{"class":784},[515,2140,1396],{"class":521},[515,2142,1399],{"class":841},[515,2144,959],{"class":784},[515,2146,1404],{"class":535},[515,2148,1407],{"class":521},[515,2150,1410],{"class":784},[515,2152,1413],{"class":521},[515,2154,2155],{"class":517,"line":709},[515,2156,1418],{"class":521},[515,2158,2159,2161,2163,2165,2167,2169,2171,2173,2175],{"class":517,"line":1421},[515,2160,1424],{"class":521},[515,2162,1364],{"class":841},[515,2164,1033],{"class":521},[515,2166,1369],{"class":1036},[515,2168,1251],{"class":784},[515,2170,1374],{"class":528},[515,2172,1040],{"class":521},[515,2174,1027],{"class":784},[515,2176,979],{"class":521},[515,2178,2179,2181,2183,2185,2187,2189,2191,2193,2195,2197,2199],{"class":517,"line":1443},[515,2180,1385],{"class":521},[515,2182,1388],{"class":992},[515,2184,1391],{"class":841},[515,2186,959],{"class":784},[515,2188,1396],{"class":521},[515,2190,1456],{"class":841},[515,2192,959],{"class":784},[515,2194,1461],{"class":535},[515,2196,1407],{"class":521},[515,2198,1410],{"class":784},[515,2200,1413],{"class":521},[515,2202,2203],{"class":517,"line":1470},[515,2204,1418],{"class":521},[515,2206,2207,2209,2211,2213,2215,2217,2219,2221],{"class":517,"line":1475},[515,2208,1334],{"class":521},[515,2210,1480],{"class":992},[515,2212,1483],{"class":841},[515,2214,959],{"class":784},[515,2216,536],{"class":535},[515,2218,1490],{"class":841},[515,2220,959],{"class":784},[515,2222,1495],{"class":521},[515,2224,2225,2227,2229],{"class":517,"line":1498},[515,2226,1501],{"class":521},[515,2228,1327],{"class":992},[515,2230,1009],{"class":521},[515,2232,2233,2235,2237,2239,2241,2243],{"class":517,"line":1508},[515,2234,1324],{"class":521},[515,2236,1513],{"class":992},[515,2238,1516],{"class":841},[515,2240,959],{"class":784},[515,2242,1521],{"class":535},[515,2244,1009],{"class":521},[515,2246,2247,2249,2251],{"class":517,"line":1526},[515,2248,1334],{"class":521},[515,2250,1147],{"class":528},[515,2252,1356],{"class":521},[515,2254,2255,2257,2259],{"class":517,"line":1535},[515,2256,1501],{"class":521},[515,2258,1513],{"class":992},[515,2260,1009],{"class":521},[515,2262,2263,2265,2267],{"class":517,"line":1544},[515,2264,1547],{"class":521},[515,2266,1309],{"class":992},[515,2268,1009],{"class":521},[515,2270,2271],{"class":517,"line":1554},[515,2272,1557],{"class":521},[515,2274,2275,2277,2279,2281,2283],{"class":517,"line":1560},[515,2276,1563],{"class":521},[515,2278,1566],{"class":535},[515,2280,532],{"class":521},[515,2282,1571],{"class":535},[515,2284,1574],{"class":521},[515,2286,2287],{"class":517,"line":1577},[515,2288,1580],{"class":521},[515,2290,2291],{"class":517,"line":1583},[515,2292,591],{"class":521},[515,2294,2295],{"class":517,"line":1588},[515,2296,1591],{"class":521},[1650,2298,2299,2300,2303,2304,2307,2308,2311,2312,2315,2316,2319],{},"Import assets using the ",[512,2301,2302],{},"?assets=client"," and ",[512,2305,2306],{},"?assets=ssr"," query parameters. Nitro collects CSS and JS assets from each entry point, and ",[512,2309,2310],{},"merge()"," combines them into a single manifest. The ",[512,2313,2314],{},"assets"," object provides arrays of stylesheet and script attributes, plus the client entry URL. Use ",[512,2317,2318],{},"renderToReadableStream"," to stream HTML as React renders, improving time-to-first-byte.",[1654,2321,2323],{"id":2322},"_4-create-the-client-entry","4. Create the Client Entry",[1650,2325,2326],{},"The client entry hydrates the server-rendered HTML, attaching React's event handlers:",[505,2328,2329],{"className":900,"code":1075,"filename":1076,"language":903,"meta":5,"style":5},[512,2330,2331,2339,2351,2363,2367],{"__ignoreMap":5},[515,2332,2333,2335,2337],{"class":517,"line":518},[515,2334,785],{"class":784},[515,2336,1085],{"class":535},[515,2338,797],{"class":521},[515,2340,2341,2343,2345,2347,2349],{"class":517,"line":525},[515,2342,785],{"class":784},[515,2344,1094],{"class":521},[515,2346,791],{"class":784},[515,2348,1099],{"class":535},[515,2350,797],{"class":521},[515,2352,2353,2355,2357,2359,2361],{"class":517,"line":542},[515,2354,785],{"class":784},[515,2356,1108],{"class":521},[515,2358,791],{"class":784},[515,2360,1113],{"class":535},[515,2362,797],{"class":521},[515,2364,2365],{"class":517,"line":551},[515,2366,830],{"emptyLinePlaceholder":397},[515,2368,2369,2371,2373,2375,2377,2379,2381,2383,2385,2387],{"class":517,"line":564},[515,2370,1124],{"class":841},[515,2372,1127],{"class":521},[515,2374,1130],{"class":841},[515,2376,965],{"class":521},[515,2378,1135],{"class":535},[515,2380,1138],{"class":521},[515,2382,1141],{"class":784},[515,2384,1144],{"class":521},[515,2386,1147],{"class":528},[515,2388,1150],{"class":521},[1650,2390,1782,2391,2394,2395,2397],{},[512,2392,2393],{},"@vitejs/plugin-react/preamble"," import is required for React Fast Refresh during development. The ",[512,2396,1124],{}," function attaches React to the existing server-rendered DOM without re-rendering it.",[1654,2399,2401],{"id":2400},"learn-more","Learn More",[2403,2404,2405,2411],"ul",{},[2406,2407,2408],"li",{},[2409,2410,18],"a",{"href":19},[2406,2412,2413],{},[2409,2414,63],{"href":64},[2416,2417,2418],"style",{},"html pre.shiki code .slsVL, html code.shiki .slsVL{--shiki-light:#24292E;--shiki-default:#E1E4E8;--shiki-dark:#E1E4E8}html pre.shiki code .suiK_, html code.shiki .suiK_{--shiki-light:#005CC5;--shiki-default:#79B8FF;--shiki-dark:#79B8FF}html pre.shiki code .sfrk1, html code.shiki .sfrk1{--shiki-light:#032F62;--shiki-default:#9ECBFF;--shiki-dark:#9ECBFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .so5gQ, html code.shiki .so5gQ{--shiki-light:#D73A49;--shiki-default:#F97583;--shiki-dark:#F97583}html pre.shiki code .shcOC, html code.shiki .shcOC{--shiki-light:#6F42C1;--shiki-default:#B392F0;--shiki-dark:#B392F0}html pre.shiki code .sByVh, html code.shiki .sByVh{--shiki-light:#22863A;--shiki-default:#85E89D;--shiki-dark:#85E89D}html pre.shiki code .sQHwn, html code.shiki .sQHwn{--shiki-light:#E36209;--shiki-default:#FFAB70;--shiki-dark:#FFAB70}",{"title":5,"searchDepth":525,"depth":525,"links":2420},[2421,2422,2423,2424,2425,2426],{"id":1656,"depth":525,"text":1657},{"id":1677,"depth":525,"text":1678},{"id":1797,"depth":525,"text":1798},{"id":1934,"depth":525,"text":1935},{"id":2322,"depth":525,"text":2323},{"id":2400,"depth":525,"text":2401},"md",{"automd":397,"category":437,"icon":335},{"icon":335},{"title":347,"description":474},"80bdNPjS8Me0yBlKa0tHYLQm0spobz1KEMLOgsoXSow",[2433,2434],{"title":342,"path":343,"stem":344,"description":471,"icon":345,"children":-1},{"title":351,"path":352,"stem":353,"description":477,"icon":354,"children":-1},1775753660446]