docs: complete react rendering configuration (#207)

README.md

@@ -488,6 +488,54 @@ createClient({
 })
 ```
 
+Configure react in `vite.config.ts`.
+
+```ts
+// vite.config.ts
+import pages from '@hono/vite-cloudflare-pages'
+import honox from 'honox/vite'
+import { defineConfig } from 'vite'
+
+export default defineConfig(({ mode }) => {
+  if (mode === 'client') {
+    return {
+      build: {
+        rollupOptions: {
+          input: ['./app/client.ts'],
+          output: {
+            entryFileNames: 'static/client.js',
+            chunkFileNames: 'static/assets/[name]-[hash].js',
+            assetFileNames: 'static/assets/[name].[ext]'
+          }
+        },
+        emptyOutDir: false
+      }
+    }
+  } else {
+    return {
+      ssr: {
+        external: ['react', 'react-dom']
+      },
+      plugins: [honox(), pages()]
+    }
+  }
+})
+```
+
+Adjust `tsconfig.json` jsx factory function option.
+
+```ts
+// tsconfig.json
+{
+  "compilerOptions": {
+    ...
+    "jsxImportSource": "react"
+    ...
+  }
+}
+
+```
+
 ## Guides
 
 ### Nested Layouts