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