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