nitrojs · roryhen · Jul 23, 2025 · Jul 23, 2025
diff --git a/README.md b/README.md
@@ -18,6 +18,7 @@
 | `hono`          | [examples/hono](./examples/hono/)                   | [stackblitz](https://stackblitz.com/fork/github/nitrojs/nitro-vite-examples/tree/main/examples/hono?startScript=dev&file=vite.config.mjs,server.ts)          | `npx giget gh:nitrojs/vite-examples/examples/hono hono-app`                   |
 | `node-compat`   | [examples/node-compat](./examples/node-compat/)     | [stackblitz](https://stackblitz.com/fork/github/nitrojs/nitro-vite-examples/tree/main/examples/node-compat?startScript=dev&file=vite.config.mjs,server.ts)   | `npx giget gh:nitrojs/vite-examples/examples/node-compat node-compat-app`     |
 | `react-ssr`     | [examples/react-ssr](./examples/react-ssr/)         | [stackblitz](https://stackblitz.com/fork/github/nitrojs/nitro-vite-examples/tree/main/examples/react-ssr?startScript=dev&file=vite.config.mjs,server.ts)     | `npx giget gh:nitrojs/vite-examples/examples/react-ssr react-ssr-app`         |
+| `solid-ssr`     | [examples/solid-ssr](./examples/solid-ssr/)         | [stackblitz](https://stackblitz.com/fork/github/nitrojs/nitro-vite-examples/tree/main/examples/solid-ssr?startScript=dev&file=vite.config.mjs,server.ts)     | `npx giget gh:nitrojs/vite-examples/examples/solid-ssr solid-ssr-app`         |
 | `vue-ssr`       | [examples/vue-ssr](./examples/vue-ssr/)             | [stackblitz](https://stackblitz.com/fork/github/nitrojs/nitro-vite-examples/tree/main/examples/vue-ssr?startScript=dev&file=vite.config.mjs,server.ts)       | `npx giget gh:nitrojs/vite-examples/examples/vue-ssr vue-ssr-app`             |
 
 <!-- /automd -->

diff --git a/examples/solid-ssr/package.json b/examples/solid-ssr/package.json
@@ -0,0 +1,15 @@
+{
+  "name": "nitro-vite-solid-ssr",
+  "version": "0.0.0",
+  "scripts": {
+    "build": "vite build",
+    "dev": "vite dev"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-react": "^4.6.0",
+    "nitro": "npm:nitro-nightly",
+    "solid-js": "^1.9.7",
+    "vite": "^7",
+    "vite-plugin-solid": "^2.11.7"
+  }
+}
diff --git a/examples/solid-ssr/src/App.tsx b/examples/solid-ssr/src/App.tsx
@@ -0,0 +1,15 @@
+/// <reference types="vite/client" />
+import { createSignal } from "solid-js";
+
+export default () => {
+  const [count, setCount] = createSignal(0);
+
+  return (
+    <div>
+      <h1>Hello, Solid!</h1>
+      <button onClick={() => setCount((count) => count + 1)}>
+        Count: {count()}
+      </button>
+    </div>
+  );
+};
diff --git a/examples/solid-ssr/src/client.tsx b/examples/solid-ssr/src/client.tsx
@@ -0,0 +1,7 @@
+/// <reference types="vite/client" />
+import { hydrate } from "solid-js/web";
+import "./styles.css";
+
+const App = await import("./App.jsx").then((mod) => mod.default);
+
+hydrate(() => <App />, document.querySelector("#app")!);
diff --git a/examples/solid-ssr/src/server.tsx b/examples/solid-ssr/src/server.tsx
@@ -0,0 +1,50 @@
+import { renderToStringAsync, generateHydrationScript } from "solid-js/web";
+import App from "./App.jsx";
+
+export default {
+  async fetch(req: Request): Promise<Response> {
+    const appHTML = await renderToStringAsync(() => <App />);
+    return new Response(indexHTML(appHTML), {
+      headers: {
+        "Content-Type": "text/html",
+      },
+    });
+  },
+};
+
+function indexHTML(appHTML: string) {
+  return /* html */ `<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + Nitro + Solid</title>
+    ${
+      import.meta.env?.DEV
+        ? '<script type="module" src="/@vite/client"></script>'
+        : ""
+    }
+  </head>
+  <body>
+    <div id="app">${appHTML}</div>
+    <script type="module" src="${resolveEntry("src/client.tsx")}"></script>
+    ${generateHydrationScript()}
+  </body>
+</html>`;
+}
+
+function resolveEntry(entry: string): string {
+  if (import.meta.env?.PROD) {
+    const manifest = globalThis.__VITE_MANIFEST__;
+    const file = manifest?.[entry]?.file;
+    if (!file) {
+      throw new Error(
+        manifest
+          ? `Entry "${entry}" not found in Vite manifest.`
+          : "Vite manifest is not available.",
+      );
+    }
+    return `/${file}`;
+  }
+  return `/${entry}`;
+}
diff --git a/examples/solid-ssr/src/styles.css b/examples/solid-ssr/src/styles.css
@@ -0,0 +1,19 @@
+div {
+  font-family: system-ui, Arial, sans-serif;
+  font-size: 20px;
+  margin-bottom: 10px;
+}
+
+button {
+  background-color: rgb(147 197 253);
+  color: rgb(15 23 42);
+  border: none;
+  padding: 10px 20px;
+  font-size: 16px;
+  cursor: pointer;
+  border-radius: 5px;
+}
+
+button:hover {
+  background-color: rgb(191 219 254);
+}
diff --git a/examples/solid-ssr/tsconfig.json b/examples/solid-ssr/tsconfig.json
@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "strict": true,
+    "target": "ESNext",
+    "module": "ESNext",
+    "moduleResolution": "node",
+    "allowSyntheticDefaultImports": true,
+    "esModuleInterop": true,
+    "jsx": "preserve",
+    "jsxImportSource": "solid-js",
+    "types": ["vite/client"],
+    "noEmit": true,
+    "isolatedModules": true
+  }
+}
diff --git a/examples/solid-ssr/vite.config.mjs b/examples/solid-ssr/vite.config.mjs
@@ -0,0 +1,16 @@
+import solid from "vite-plugin-solid";
+import { defineConfig } from "vite";
+import { nitro } from "nitro/vite";
+
+export default defineConfig({
+  plugins: [solid({ ssr: true }), nitro()],
+  esbuild: {
+    jsx: "preserve",
+    jsxImportSource: "solid-js",
+  },
+  environments: {
+    client: {
+      build: { rollupOptions: { input: "./src/client.tsx" } },
+    },
+  },
+});