chore: migrate to @resolid/dev and clean up routing configuration

Author: huijiewei

pnpm-lock.yaml

@@ -4,6 +4,8 @@
 declare namespace NodeJS {
   export interface ProcessEnv {
     readonly SERVER_PORT: number | undefined;
+
+    readonly VERCEL: number;
   }
 }
 

website/env.d.ts

@@ -28,8 +28,7 @@
     "@mdx-js/rollup": "^3.1.1",
     "@react-router/dev": "^7.13.1",
     "@resolid/config": "^5.0.2",
-    "@resolid/flex-routes": "^1.6.0",
-    "@resolid/react-router-hono": "^2.3.2",
+    "@resolid/dev": "^0.2.0",
     "@shikijs/rehype": "^3.23.0",
     "@tailwindcss/vite": "^4.2.1",
     "@types/react": "^19.2.14",

website/package.json

@@ -1,30 +1,3 @@
-import type { Config } from "@react-router/dev/config";
-import { nodePreset } from "@resolid/react-router-hono/node-preset";
-import { vercelPreset } from "@resolid/react-router-hono/vercel-preset";
-import { env } from "node:process";
+import { reactRouterConfig } from "./resolid.config";
 
-const includeFiles = [".resolid/content/*.json"];
-
-// noinspection JSUnusedGlobalSymbols
-export default {
-  appDirectory: "src",
-  ssr: true,
-  presets: [
-    env.VERCEL == "1"
-      ? vercelPreset({
-          entryFile: "server.vercel.ts",
-          includeFiles,
-          nodeVersion: 24,
-        })
-      : nodePreset({
-          entryFile: "server.node.ts",
-          includeFiles,
-          nodeVersion: 24,
-        }),
-  ],
-  future: {
-    unstable_optimizeDeps: true,
-    v8_splitRouteModules: true,
-    v8_viteEnvironmentApi: true,
-  },
-} satisfies Config;
+export default reactRouterConfig;

website/react-router.config.ts

@@ -0,0 +1,14 @@
+import { defineDevConfig } from "@resolid/dev";
+import { env } from "node:process";
+
+export const { vitePluginOptions, reactRouterConfig } = defineDevConfig({
+  appDirectory: "src",
+  nodeVersion: 24,
+  platform: env.VERCEL == 1 ? "vercel" : "node",
+  devExclude: ["/.resolid/**/*"],
+  reactRouterConfig: {
+    future: {
+      unstable_optimizeDeps: true,
+    },
+  },
+});

website/resolid.config.ts

@@ -0,0 +1,74 @@
+import { isbot } from "isbot";
+import { PassThrough, Readable } from "node:stream";
+import { type RenderToPipeableStreamOptions, renderToPipeableStream } from "react-dom/server";
+import { type AppLoadContext, type EntryContext, ServerRouter } from "react-router";
+
+export const streamTimeout = 9_000;
+
+export default function handleRequest(
+  request: Request,
+  responseStatusCode: number,
+  responseHeaders: Headers,
+  routerContext: EntryContext,
+  _loadContext: AppLoadContext,
+): Response | Promise<unknown> {
+  if (request.method.toUpperCase() === "HEAD") {
+    return new Response(null, {
+      status: responseStatusCode,
+      headers: responseHeaders,
+    });
+  }
+
+  return new Promise((resolve, reject) => {
+    let shellRendered = false;
+
+    const userAgent = request.headers.get("User-Agent");
+
+    const readyOption: keyof RenderToPipeableStreamOptions =
+      userAgent && isbot(userAgent) ? "onAllReady" : "onShellReady";
+
+    let timeoutId: ReturnType<typeof setTimeout> | undefined = setTimeout(
+      () => abort(),
+      streamTimeout + 1000,
+    );
+
+    const { pipe, abort } = renderToPipeableStream(
+      <ServerRouter context={routerContext} url={request.url} />,
+      {
+        [readyOption]() {
+          shellRendered = true;
+
+          const body = new PassThrough({
+            final(callback) {
+              clearTimeout(timeoutId);
+              timeoutId = undefined;
+              callback();
+            },
+          });
+
+          const stream = Readable.toWeb(body) as ReadableStream<Uint8Array>;
+
+          responseHeaders.set("Content-Type", "text/html; charset=utf-8");
+
+          pipe(body);
+
+          resolve(
+            new Response(stream, {
+              headers: responseHeaders,
+              status: responseStatusCode,
+            }),
+          );
+        },
+        onShellError(error: unknown) {
+          reject(error);
+        },
+        onError(error: unknown) {
+          responseStatusCode = 500;
+          if (shellRendered) {
+            console.error(error);
+          }
+        },
+      },
+    );
+  });
+}

website/src/entry.server.tsx

@@ -1,5 +1,4 @@
 import type { RouteConfig } from "@react-router/dev/routes";
-import { flexRoutes } from "@resolid/flex-routes";
+import { flexRoutes } from "@resolid/dev/routes";
 
-// noinspection JSUnusedGlobalSymbols
 export default flexRoutes() satisfies RouteConfig;

website/src/routes.ts

@@ -0,0 +1,14 @@
+import { createServer, nodeConfig, vercelConfig } from "@resolid/dev/server";
+import { env } from "node:process";
+
+export default await createServer((platform) => {
+  switch (platform) {
+    case "vercel":
+      return vercelConfig({});
+
+    default:
+      return nodeConfig({
+        port: env.SERVER_PORT,
+      });
+  }
+});