Adapter configuration in Svelte

Introduction

Adapter configuration helps SvelteKit know how to build your app for different environments like static sites or servers.

When you want to deploy your SvelteKit app to a static hosting service like Netlify or Vercel.

When you need your app to run on a Node.js server.

When you want to generate a fully static site with pre-rendered pages.

When you want to customize how your app is built and deployed.

Syntax

Svelte

import adapter from '@sveltejs/adapter-node';

export default {
  kit: {
    adapter: adapter({
      // adapter options here
    })
  }
};

You import the adapter package that matches your deployment target.

You pass options inside the adapter() function to customize behavior.

Examples

This config uses the static adapter to build a static site with output in the 'build' folder.

Svelte

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

export default {
  kit: {
    adapter: adapter({
      pages: 'build',
      assets: 'build',
      fallback: null
    })
  }
};

This config uses the Node adapter to build a server app with output in the 'build' folder.

Svelte

import adapter from '@sveltejs/adapter-node';

export default {
  kit: {
    adapter: adapter({
      out: 'build'
    })
  }
};

Sample Program

This example configures SvelteKit to build a static site. The pages and assets will be placed in the 'public' folder. The fallback page is 'index.html' for single-page app behavior.

Svelte

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

export default {
  kit: {
    adapter: adapter({
      pages: 'public',
      assets: 'public',
      fallback: 'index.html'
    })
  }
};

Important Notes

Always install the adapter package you want to use with npm or yarn before configuring.

Adapters control how your app is built and deployed, so choose one that fits your hosting environment.

Check adapter documentation for specific options you can set.

Summary

Adapter configuration tells SvelteKit how to build your app for different environments.

You import and set an adapter in the kit.adapter property in svelte.config.js.

Different adapters are for static sites, Node servers, or other platforms.