PreviewDrop for SvelteKit

Deploy previews for SvelteKit apps

Push a branch, get a live preview URL. PreviewDrop builds your SvelteKit app with adapter-node, runs it as a real Node server, and posts the link to the pull request, usually within a couple of minutes.

TL;DR

Switch to @sveltejs/adapter-node, connect your repo, push. PreviewDrop detects SvelteKit, builds the image and runs node build behind a TLS-terminated subdomain. SSR, form actions, hooks and +server.ts endpoints all run in a real Node process.

What the build needs to do

You don't write this. PreviewDrop detects SvelteKitfrom your repo and builds the container for you — a Dockerfile in your repo is not used. The reference below shows the install, build and start steps a working SvelteKit image needs. If detection gets one wrong, set the matching Install, Build or Start command in Project Settings. Your app must listen on $PORT.

Reference (not read by PreviewDrop)
FROM node:22-slim AS build
WORKDIR /app
COPY package*.json ./
RUN npm ci
COPY . .
RUN npm run build

FROM node:22-slim
WORKDIR /app
ENV NODE_ENV=production HOST=0.0.0.0
COPY --from=build /app/build ./build
COPY package*.json ./
RUN npm ci --omit=dev
EXPOSE 3000
CMD ["node", "build"]

Environment variables

Set these in the Variables tab of your PreviewDrop project. They're encrypted at rest and injected into every preview container at start.

Variable	Example value	Note
PORT	3000	adapter-node reads PORT automatically.
HOST	0.0.0.0	Makes the server reachable from the proxy.
PROTOCOL_HEADER	x-forwarded-proto	Pair with HOST_HEADER=x-forwarded-host so SvelteKit derives the right origin — see gotcha.

Common gotchas

Use @sveltejs/adapter-node, not adapter-auto

A standalone Node server only exists with @sveltejs/adapter-node. The default adapter-auto can silently select a Vercel/Netlify adapter in CI and produce no build/index.js to run.

Set the origin so form actions don’t fail CSRF

SvelteKit blocks cross-origin POSTs. Because preview URLs are generated per branch, set PROTOCOL_HEADER=x-forwarded-proto and HOST_HEADER=x-forwarded-host so it derives the origin from the proxy headers — otherwise form actions return a 403 on the preview domain.

Install production deps in the runtime stage

adapter-node’s build/ still needs your runtime dependencies. The reference build above copies package.json and runs npm ci --omit=dev so the server can resolve them.

Bind to 0.0.0.0

Set HOST=0.0.0.0 (PreviewDrop sets it in the container). Without it the server can bind to localhost inside the container and the preview will 502.

Why not Vercel or Netlify?

SvelteKit ships first-class Vercel and Netlify adapters — PreviewDrop is for when you’d rather self-host the adapter-node server, want password-protected previews to share before merge, prefer flat per-workspace pricing, or run SvelteKit alongside a backend service that also needs branch previews. Every branch, your infra.

Preview your SvelteKit app in 5 minutes

Connect a repo, push a branch, get a URL. No credit card, no trial clock.

Start free