Profile avatar

Chizi Victor

Snippets

Dec 05, 2024

SvelteKit Static Config

Config files for deploying SvelteKit apps with the adapter-static.

Although this should work with any hosting provider, I use Railway to deploy my applications, so this setup directly mirrors a configuration I use with Railway.

I prefer using Caddy over nginx because it’s got better performance the only server I know how to use.

# Caddyfile

:{$PORT}

# serve from the 'usr/share/caddy' folder (matches the docker build output)
root * /usr/share/caddy

# serve the files in the output folder
file_server

# if path doesn't exist, redirect it to 'index.html' for client side routing
try_files {path} /index.html

Docker makes it easy to build and deploy to any platform.

# Dockerfile

FROM node:21-alpine AS builder
WORKDIR /app

COPY package.json pnpm-lock.yaml* ./
RUN npm i -g pnpm && pnpm i --frozen-lockfile;

# Optionally, pass environment variables to the build
# ARG <env-var>

COPY . .
RUN pnpm run build
RUN pnpm prune --production

# Production Stage
FROM caddy:alpine AS runner
WORKDIR /app

COPY --from=builder /app/build /usr/share/caddy
COPY ./Caddyfile /etc/caddy/Caddyfile

Here’s a basic implementation of the adapter-static from sveltekit. Refer to SvelteKit’s documentation for more information.

// svelte.config.js

import adapter from "@sveltejs/adapter-static";

/** @type {import('@sveltejs/kit').Config} */
const config = {
  // ...

  kit: {
    adapter: adapter({
      // default options are shown. On some platforms
      // these options are set automatically — see below
      pages: "build",
      assets: "build",
      fallback: undefined,
      precompress: false,
      strict: true,
    }),
  },
  },
};