Skip to content

SvelteKit

Neon.Website.SvelteKit packages SvelteKit’s server handler and assets for a Node 24 Fetch entry on Neon Functions. The Node adapter supplies a handler, not a listening production server; no container or S3 hosting is provisioned.

Prepare the app

Section titled “Prepare the app”

Start from a compatible SvelteKit app or the runnable SvelteKit example. This integration targets the Kit v3 plugin configuration shape. Configure deployment credentials, then install in the app directory:

Install Alchemy and its matching Effect dependencies first; use Node 24 for this build toolchain.

Terminal window
pnpm add -D @alchemy.run/frontend-frameworks @vercel/nft

Keep sveltekit() in vite.config.*, without your own adapter. For Kit v3, use plugin configuration or the resource’s serializable kit overrides rather than a svelte.config.js file. Alchemy injects the deployment adapter.

Define the stack

Section titled “Define the stack”
alchemy.run.ts
import * as Alchemy from "alchemy";
import * as Neon from "alchemy/Neon";
import * as Effect from "effect/Effect";


export default Alchemy.Stack(
  "NeonSvelteKit",
  { providers: Neon.providers(), state: Alchemy.localState() },
  Effect.gen(function* () {
    const site = yield* Neon.Website.SvelteKit("Web", {
      rootDir: ".",
    });
    return { url: site.url };
  }),
);

SvelteKit handles SSR, endpoints, and form actions; prerendered pages and client assets are packaged alongside it. Use SvelteKit’s $env/static/private or $env/dynamic/private as appropriate for build-time versus runtime values. Public environment modules expose values to the browser; never put backend secrets there.

Develop and deploy

Section titled “Develop and deploy”
Terminal window
pnpm exec alchemy dev
pnpm exec alchemy deploy
pnpm exec alchemy destroy

Run each separately, with destroy for cleanup. Dev runs the native SvelteKit/Vite server with HMR and returns a local URL, without an implicit Neon Project or Function. Append .pipe(Alchemy.remote()) to the Website Effect to opt into live deployment during dev.

Without scope, live deploy creates an Ohio Project. Pass either project or branch to reuse a backend; use Ohio when adding storage. See scope and credentials, including the difference between account keys and branch service tokens.

Reference

Section titled “Reference”