1---
2title: SolidStart
3description: Deploy SolidStart to Prisma Compute with Prisma.Website.SolidStart — Nitro's Node target on Bun and SolidStart's native Vite dev server locally.
4sidebar:
5 order: 10.5
6---
7
8import { Code, Tabs, TabItem } from "@astrojs/starlight/components";
9
10export const devDeps = "@alchemy.run/frontend-frameworks @vercel/nft";
11
12`Prisma.Website.SolidStart` runs your [SolidStart](https://start.solidjs.com)
13project's Vite build with Nitro's Node preset. SSR, client assets, and
14prerendered pages run on **Bun in Prisma Compute** from a `tar.gz`
15artifact, not a Docker image.
16
17:::note[Version line]
18This integration targets `@solidjs/start` 2.x with
19`@solidjs/vite-plugin-nitro-2`: `solidStart()` is a Vite plugin, and
20Nitro is a second plugin managed by Alchemy.
21:::
22
23## Install
24
25Install the build integration; the resource loads `/solidstart` and
26`/solidstart/node` from your project:
27
28<Tabs syncKey="pkgManager">
29 <TabItem label="bun" icon="bun"><Code code={`bun add -d ${devDeps}`} lang="sh" /></TabItem>
30 <TabItem label="npm" icon="npm"><Code code={`npm install -D ${devDeps}`} lang="sh" /></TabItem>
31 <TabItem label="pnpm" icon="pnpm"><Code code={`pnpm add -D ${devDeps}`} lang="sh" /></TabItem>
32 <TabItem label="yarn" icon="seti:yarn"><Code code={`yarn add -D ${devDeps}`} lang="sh" /></TabItem>
33</Tabs>
34
35Install the Nitro plugin dependency too:
36
37<Tabs syncKey="pkgManager">
38 <TabItem label="bun" icon="bun"><Code code="bun add @solidjs/vite-plugin-nitro-2" lang="sh" /></TabItem>
39 <TabItem label="npm" icon="npm"><Code code="npm install @solidjs/vite-plugin-nitro-2" lang="sh" /></TabItem>
40 <TabItem label="pnpm" icon="pnpm"><Code code="pnpm add @solidjs/vite-plugin-nitro-2" lang="sh" /></TabItem>
41 <TabItem label="yarn" icon="seti:yarn"><Code code="yarn add @solidjs/vite-plugin-nitro-2" lang="sh" /></TabItem>
42</Tabs>
43
44## Configure Vite
45
46```typescript
47// vite.config.ts
48import { solidStart } from "@solidjs/start/config";
49import tailwindcss from "@tailwindcss/vite";
50import { defineConfig } from "vite";
51
52export default defineConfig({
53 plugins: [solidStart(), tailwindcss()],
54});
55```
56
57Alchemy appends `nitroV2Plugin()` with its Node preset at build time.
58Don't register another Nitro plugin yourself: conflicting instances
59fail the build. Put Nitro overrides in the resource's `nitro` bag.
60
61## Declare the Website
62
63```typescript
64// alchemy.run.ts
65import * as Prisma from "alchemy/Prisma";
66
67export const Website = Prisma.Website.SolidStart("Website", {
68 rootDir: "./app",
69});
70```
71
72Omit `rootDir` for an app at `.`. Pass `project` to share an existing
73project; otherwise live deploy creates a database-less Prisma project.
74
75## Add it to the Stack
76
77```typescript
78// alchemy.run.ts
79import * as Alchemy from "alchemy";
80import * as Effect from "effect/Effect";
81
82export default Alchemy.Stack(
83 "MySolidStartSite",
84 { providers: Prisma.providers(), state: Alchemy.localState() },
85 Effect.gen(function* () {
86 const site = yield* Website;
87 return { url: site.url };
88 }),
89);
90```
91
92`site.url` is the Compute endpoint on deploy and the local address in dev.
93
94## Add environment variables
95
96```diff lang="typescript"
97export const Website = Prisma.Website.SolidStart("Website", {
98 rootDir: "./app",
99+ env: { API_BASE: "https://api.example.com" },
100});
101```
102
103Values are applied before build and dev and passed to Compute. Vite
104inlines `VITE_*` keys into the client bundle; keep secrets out of them.
105Sibling resource outputs can feed `env` inside the Stack generator.
106
107## Read the environment in server code
108
109```typescript
110// src/routes/api/hello.ts
111export function GET() {
112 return new Response(process.env.API_BASE ?? "unset");
113}
114```
115
116API routes, server functions, and SSR run on Bun and read `process.env`.
117
118## Prerendering
119
120```typescript
121export const Website = Prisma.Website.SolidStart("Website", {
122 nitro: { prerender: { routes: ["/", "/about"] } },
123});
124```
125
126Nitro emits those pages into `.output/public`; Compute serves them as
127files without invoking SSR. `crawlLinks` can discover more routes.
128The `nitro` bag accepts serializable options such as route rules and
129storage, but the Node target owns `preset`.
130
131## Local dev
132
133`alchemy dev` runs SolidStart's Vite server with HMR; Nitro is not part
134of the dev path and the Website creates no Prisma resources. SolidStart
135resolves the app root from the working directory, so run one SolidStart
136app per dev process.
137
138:::caution[Run SolidStart dev under Node]
139The SolidStart 2 dev server's `srvx/node` path can return
140`[object Object]` under Bun. Use `npx alchemy dev` for the dev server.
141This is a local dev-server limitation, not a change to Prisma's
142production runtime: the deployed Node-target build runs on Bun.
143:::
144
145Opt into the live deployment during dev explicitly:
146
147```typescript
148export const Website = Prisma.Website.SolidStart("Website").pipe(
149 Alchemy.remote(),
150);
151```
152
153## Custom domain
154
155```typescript
156const site = yield* Prisma.Website.SolidStart("Web", {
157 domain: "app.example.com",
158});
159```
160
161`Prisma.CustomDomain` requires the app to be on the current default
162branch. Configure returned DNS records yourself and verify status before
163cutover; see [Custom domains](/prisma/frontend/websites#custom-domains).
164
165## Where next
166
167- [SolidStart API](/providers/prisma/website/solidstart).
168- [SolidStart example](https://github.com/alchemy-run/alchemy/tree/main/examples/prisma-website-solidstart).
169- [Websites](/prisma/frontend/websites) and [Compute apps](/prisma/compute/apps).