SvelteKitSite

Deploy SvelteKit to AWS in one component: S3, CloudFront, Lambda, HTTPS and DNS. Security headers on, form actions working, WAF ready.

Hosting · anvil:aws:SvelteKitSite

Anvil runs your build with adapter-node, then provisions the S3 bucket for static assets, a CloudFront distribution, a Node.js 22 Lambda running your server via the Lambda Web Adapter, and — when domain is set — the ACM certificate and Route53 record for HTTPS. Without domain, the site is served from its CloudFront URL.

Minimal

The smallest config that deploys.

import { App } from '@anvil-cloud/sdk';
import * as anvil from '@anvil-cloud/sdk';

export default new App({
  run(ctx) {
    const site = new anvil.aws.SvelteKitSite('web', { path: 'web' });

    ctx.export('url', site.url);
  },
});

import anvil_cloud as anvil

def infra(ctx: anvil.Context):
    site = anvil.aws.SvelteKitSite("web", path="web")

    ctx.export("url", site.url)

anvil.App(run=infra)

package main

import (
    "github.com/anvil-cloud/anvil/sdk/go/anvil"
    anvilaws "github.com/anvil-cloud/anvil/sdk/go/anvil/aws"
    "github.com/pulumi/pulumi/sdk/v3/go/pulumi"
)

func main() {
    anvil.Run(anvil.AppConfig{
        Run: func(ctx *anvil.Context) error {
            site, err := anvilaws.NewSvelteKitSite(ctx.PulumiCtx(), "web", &anvilaws.SvelteKitSiteArgs{
                Path: pulumi.String("web"),
            })
            if err != nil {
                return err
            }
            ctx.Export("url", site.Url)
            return nil
        },
    })
}

Supported versions

Anvil runs your app's own npm run build, so the Node.js on your machine (or CI) has to meet SvelteKit's requirement. The deployed server always runs on a Node.js 22 Lambda.

Good to know

• environment values are available at build time and at runtime, so they must be plain strings. Values from other components, such as bucket.bucketName, go in runtimeEnvironment, which isn't available while prerendering.
• Form actions work with the default edge-oac protection, with and without JavaScript. Named actions (?/name) need edge-oac; with oac AWS rejects them with a 400.
• Security headers are on, but Content-Security-Policy is up to you: set kit.csp in your SvelteKit config to have SvelteKit generate one with nonces.
• Known issue: fetch requests to +server.ts endpoints with a form-like body or no Content-Type get SvelteKit's 403 cross-site error. JSON requests and form actions work, and a fix is in progress.