React compiler

package.json

@@ -49,6 +49,7 @@
 		"zod": "3.23.8"
 	},
 	"devDependencies": {
+		"@babel/preset-typescript": "7.26.0",
 		"@biomejs/biome": "1.9.4",
 		"@dotenvx/dotenvx": "1.24.5",
 		"@react-router/dev": "7.0.1",
@@ -61,6 +62,7 @@
 		"@vitest/coverage-v8": "2.1.5",
 		"@vitest/ui": "2.1.5",
 		"autoprefixer": "10.4.20",
+		"babel-plugin-react-compiler": "19.0.0-beta-df7b47d-20241124",
 		"chalk": "5.3.0",
 		"happy-dom": "15.11.6",
 		"jest-preview": "0.3.1",
@@ -74,6 +76,7 @@
 		"tsx": "4.19.2",
 		"typescript": "5.6.3",
 		"vite": "5.4.11",
+		"vite-plugin-babel": "1.3.0",
 		"vite-plugin-icons-spritesheet": "2.2.1",
 		"vite-tsconfig-paths": "5.1.3",
 		"vitest": "2.1.5"

vite.config.ts

@@ -4,9 +4,19 @@ import { reactRouterHonoServer } from "react-router-hono-server/dev"
 import { defineConfig } from "vite"
 import { iconsSpritesheet } from "vite-plugin-icons-spritesheet"
 import tsconfigPaths from "vite-tsconfig-paths"
+import babel from "vite-plugin-babel";
 
 export default defineConfig({
 	plugins: [
+		// Run the react-compiler on .tsx files
+		babel({
+			include: ["./app/**/*"],
+			filter: name => name.endsWith("tsx"),
+			babelConfig: {
+				presets: ["@babel/preset-typescript"],
+				plugins: ["babel-plugin-react-compiler"]
+			}
+		}),
 		reactRouterDevTools(),
 		reactRouter(),
 		reactRouterHonoServer({