A SvelteKit app is built with vite build, and an adapter turns the output into something your target platform can run. The same code can be deployed to a Node.js server, a static host or a serverless platform just by switching adapters.
Build and preview
npm run build # vite build: build the app and run the adapter
npm run preview # check the build locally (http://localhost:4173 by default)
npm run preview uses Vite's preview server to check the result; it is not meant to serve production traffic. How the app actually runs in production is decided by the adapter.
Choosing an adapter
The adapter is set in the sveltekit() options in vite.config.ts. New projects start with adapter-auto, which detects supported environments at build time, but once you know where you are deploying it is better to install and configure that adapter explicitly.
Community adapters cover many other platforms as well.
Deploying to a Node.js server
npm install -D @sveltejs/adapter-node
// vite.config.ts
import adapter from '@sveltejs/adapter-node';
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
export default defineConfig({
plugins: [
sveltekit({
adapter: adapter(),
paths: { origin: 'https://example.com' }
})
]
});
npm run build writes a server to the build folder, which you start with node build. It listens on 0.0.0.0:3000 by default; change that with the PORT and HOST environment variables. paths.origin is the public URL of your app and is used for CSRF checks and prerendering. Packages in devDependencies are bundled into the output, while packages in dependencies are loaded from node_modules at runtime, so the server needs the build folder, package.json and production dependencies. .env files are not loaded automatically in production; if you rely on one, start the app with node --env-file=.env build.
Packaging with Docker
FROM node:lts-alpine AS build
WORKDIR /app
COPY package*.json ./
RUN npm ci
COPY . .
RUN npm run build && npm prune --omit=dev
FROM node:lts-alpine
WORKDIR /app
COPY --from=build /app/build ./build
COPY --from=build /app/node_modules ./node_modules
COPY package.json .
ENV NODE_ENV=production
EXPOSE 3000
CMD ["node", "build"]
The multi-stage build keeps compilers and dev tooling out of the final image, which contains only the built server and its runtime dependencies.
Deploying as a static site
For hosts that only serve files, such as GitHub Pages, a plain web server or a CDN, use adapter-static. Every page must be generated as HTML at build time, so enable prerender in the root layout.
// sveltekit() options in vite.config.ts
import adapter from '@sveltejs/adapter-static';
sveltekit({
adapter: adapter({
pages: 'build',
assets: 'build',
fallback: undefined,
precompress: false,
strict: true
})
});
// src/routes/+layout.ts
// export const prerender = true;
With this approach, features that need a server on every request, such as form actions and server loads at request time, are not available. To ship an app that cannot be prerendered as an SPA, set fallback: '200.html', but this hurts performance and SEO, so use it only when you really need it.
Before you deploy
- Make sure
npm run check and your tests pass. - Read secrets only through
$app/env/private and supply them as environment variables in production. - If your Node server runs behind a reverse proxy, review the proxy header settings in the
adapter-node docs. - Once your target is known, replace
adapter-auto with the specific adapter.
Summary
npm run build builds the app, and the adapter produces the deployable output.- Use
adapter-node with node build for Node servers, and adapter-static with prerendering for static hosts. - Dedicated adapters exist for platforms such as Vercel, Netlify and Cloudflare.
For more detail, see the official documentation:
0 comments
Sign in · Sign in to leave a comment.