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