SvelteKit static hosting

SvelteKit can prerender every page at build time and write the result as plain files with @sveltejs/adapter-static. Lobsite hosts those files. Build with the static adapter, run npx lobsite, and the site is live at a *.lobsite.app address with HTTPS. This page is about fully prerendered sites. Server routes and form actions need a host that runs SvelteKit on a server.

How it works

1. Switch to the static adapter and prerender every page (see below), then run npm run build. The site lands in build/.
2. Run npx lobsite in the project. It deploys build/, not static/ or .svelte-kit/. The first deploy needs no account and lasts 6 hours.
3. Keep it with the claim link, in a free account. After that, npm run build && npx lobsite updates the same address.

adapter-static and prerendering

// svelte.config.js
import adapter from "@sveltejs/adapter-static";

export default {
  kit: { adapter: adapter() },
};

// src/routes/+layout.js
export const prerender = true;

• prerender = true in the root layout makes every page render at build time. If a page can't be prerendered, the build fails and tells you which one, so nothing broken gets deployed.
• fallback: "200.html" is for pages that can't be prerendered: SvelteKit writes a 200.html shell, and Lobsite serves it for any path that isn't a file, so those pages render in the browser. Prerendered pages are still better for search engines and first load.
• trailingSlash can stay at its default: /about is written as about.html and served at /about.

What runs at build time, and what can't

load functions, including ones in +page.server.js, run during the build when a page is prerendered, so data from files or APIs is baked into the HTML. Dynamic routes are found by following links from your pages; list any that aren't linked in prerender.entries. What can't work without a server: form actions, +server.js endpoints other than prerendered GET ones, hooks that run per request, and reading cookies. For a contact form, post it to /_lobsite/forms/contact instead of a form action; see forms.

SvelteKit hosts compared

If your app renders pages on request, use an adapter for a host that runs it. If every page can be prerendered, as with marketing sites, blogs and docs, Lobsite hosts it with one command and uploads only the files each build changed.

Frequently asked questions

Which SvelteKit adapter should I use for Lobsite?

@sveltejs/adapter-static, with every page prerendered. adapter-auto and the platform adapters build for servers and functions, which Lobsite doesn't run.

Can a SvelteKit SPA with a fallback page run here?

Yes. Set adapter({ fallback: "200.html" }): Lobsite serves 200.html with status 200 for every path that isn't a file, and SvelteKit's router renders the page in the browser. Prerendered pages are still served as they are.

Why did my SvelteKit build fail with a prerender error?

A page couldn't render at build time, often because it reads url.searchParams, cookies or a form action. Move that work to the browser, or into a load function that only uses data available at build time.

Do SvelteKit page transitions still work after prerendering?

Yes. The prerendered pages load SvelteKit's client, which takes over navigation after the first page, so links still change pages without a full reload.