remix-run · markdalgleish · Mar 31, 2025 · Mar 31, 2025
diff --git a/playground/framework-rolldown-vite/.gitignore b/playground/framework-rolldown-vite/.gitignore
@@ -0,0 +1,6 @@
+node_modules
+
+/build
+.env
+
+.react-router/
diff --git a/playground/framework-rolldown-vite/app/root.tsx b/playground/framework-rolldown-vite/app/root.tsx
@@ -0,0 +1,23 @@
+import { Links, Meta, Outlet, Scripts, ScrollRestoration } from "react-router";
+
+export function Layout({ children }: { children: React.ReactNode }) {
+  return (
+    <html lang="en">
+      <head>
+        <meta charSet="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <Meta />
+        <Links />
+      </head>
+      <body>
+        {children}
+        <ScrollRestoration />
+        <Scripts />
+      </body>
+    </html>
+  );
+}
+
+export default function App() {
+  return <Outlet />;
+}
diff --git a/playground/framework-rolldown-vite/app/routes.ts b/playground/framework-rolldown-vite/app/routes.ts
@@ -0,0 +1,6 @@
+import { type RouteConfig, index, route } from "@react-router/dev/routes";
+
+export default [
+  index("routes/_index.tsx"),
+  route("products/:id", "routes/product.tsx"),
+] satisfies RouteConfig;
diff --git a/playground/framework-rolldown-vite/app/routes/_index.tsx b/playground/framework-rolldown-vite/app/routes/_index.tsx
@@ -0,0 +1,9 @@
+import type { Route } from "./+types/_index";
+
+export function loader({ params }: Route.LoaderArgs) {
+  return { planet: "world", date: new Date(), fn: () => 1 };
+}
+
+export default function Index({ loaderData }: Route.ComponentProps) {
+  return <h1>Hello, {loaderData.planet}!</h1>;
+}
diff --git a/playground/framework-rolldown-vite/app/routes/product.tsx b/playground/framework-rolldown-vite/app/routes/product.tsx
@@ -0,0 +1,9 @@
+import type { Route } from "./+types/product";
+
+export function loader({ params }: Route.LoaderArgs) {
+  return { name: `Super cool product #${params.id}` };
+}
+
+export default function Component({ loaderData }: Route.ComponentProps) {
+  return <h1>{loaderData.name}</h1>;
+}
diff --git a/playground/framework-rolldown-vite/package.json b/playground/framework-rolldown-vite/package.json
@@ -0,0 +1,36 @@
+{
+  "name": "@playground/framework-rolldown-vite",
+  "version": "0.0.0",
+  "private": true,
+  "sideEffects": false,
+  "type": "module",
+  "scripts": {
+    "build": "cross-env ROLLDOWN_OPTIONS_VALIDATION=loose react-router build",
+    "dev": "react-router dev",
+    "start": "react-router-serve ./build/server/index.js",
+    "typecheck": "react-router typegen && tsc"
+  },
+  "dependencies": {
+    "@react-router/node": "workspace:*",
+    "@react-router/serve": "workspace:*",
+    "cross-env": "^7.0.3",
+    "isbot": "^5.1.11",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-router": "workspace:*"
+  },
+  "devDependencies": {
+    "@react-router/dev": "workspace:*",
+    "@types/react": "^18.2.20",
+    "@types/react-dom": "^18.2.7",
+    "typescript": "^5.1.6",
+    "vite": "npm:[email protected]",
+    "vite-tsconfig-paths": "^4.2.1"
+  },
+  "overrides": {
+    "vite": "npm:[email protected]"
+  },
+  "engines": {
+    "node": ">=20.0.0"
+  }
+}
diff --git a/playground/framework-rolldown-vite/public/favicon.ico b/playground/framework-rolldown-vite/public/favicon.ico
diff --git a/playground/framework-rolldown-vite/react-router.config.ts b/playground/framework-rolldown-vite/react-router.config.ts
@@ -0,0 +1,3 @@
+import type { Config } from "@react-router/dev/config";
+
+export default {} satisfies Config;
diff --git a/playground/framework-rolldown-vite/tsconfig.json b/playground/framework-rolldown-vite/tsconfig.json
@@ -0,0 +1,31 @@
+{
+  "include": [
+    "**/*.ts",
+    "**/*.tsx",
+    "**/.server/**/*.ts",
+    "**/.server/**/*.tsx",
+    "**/.client/**/*.ts",
+    "**/.client/**/*.tsx",
+    "./.react-router/types/**/*"
+  ],
+  "compilerOptions": {
+    "lib": ["DOM", "DOM.Iterable", "ES2022"],
+    "types": ["@react-router/node", "vite/client"],
+    "verbatimModuleSyntax": true,
+    "esModuleInterop": true,
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "resolveJsonModule": true,
+    "target": "ES2022",
+    "strict": true,
+    "allowJs": true,
+    "skipLibCheck": true,
+    "baseUrl": ".",
+    "paths": {
+      "~/*": ["./app/*"]
+    },
+    "noEmit": true,
+    "rootDirs": [".", "./.react-router/types"]
+  }
+}
diff --git a/playground/framework-rolldown-vite/vite.config.ts b/playground/framework-rolldown-vite/vite.config.ts
@@ -0,0 +1,11 @@
+import { reactRouter } from "@react-router/dev/vite";
+import { defineConfig } from "vite";
+import tsconfigPaths from "vite-tsconfig-paths";
+
+export default defineConfig({
+  plugins: [
+    // @ts-expect-error `dev` depends on Vite 6, Plugin type is mismatched.
+    reactRouter(),
+    tsconfigPaths(),
+  ],
+});
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		import type { Config } from "@react-router/dev/config";

		export default {} satisfies Config;