Skip to main content

Adapters

Edit this page on GitHub

Before you can deploy your SvelteKit app, you need to adapt it for your deployment target. Adapters are small plugins that take the built app as input and generate output for deployment.

By default, projects are configured to use @sveltejs/adapter-auto, which detects your production environment and selects the appropriate adapter where possible. If your platform isn't (yet) supported, you may need to install a custom adapter or write one.

See the adapter-auto README for information on adding support for new environments.

Supported environments

SvelteKit offers a number of officially supported adapters.

You can deploy to the following platforms with the default adapter, adapter-auto:

Node.js

To create a simple Node server, install the @sveltejs/adapter-node package and update your svelte.config.js:

svelte.config.js
import adapter from '@sveltejs/adapter-auto';
import adapter from '@sveltejs/adapter-node';

With this, vite build will generate a self-contained Node app inside the build directory. You can pass options to adapters, such as customising the output directory:

svelte.config.js
import adapter from '@sveltejs/adapter-node';

export default {
  kit: {
		adapter: adapter()
		adapter: adapter({ out: 'my-output-directory' })
  }
};

Static sites

Most adapters will generate static HTML for any prerenderable pages of your site. In some cases, your entire app might be prerenderable, in which case you can use @sveltejs/adapter-static to generate static HTML for all your pages. A fully static site can be hosted on a wide variety of platforms, including static hosts like GitHub Pages.

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

You can also use adapter-static to generate single-page apps (SPAs) by specifying a fallback page and disabling SSR.

You must ensure trailingSlash is set appropriately for your environment. If your host does not render /a.html upon receiving a request for /a then you will need to set trailingSlash: 'always' to create /a/index.html instead.

Platform-specific context

Some adapters may have access to additional information about the request. For example, Cloudflare Workers can access an env object containing KV namespaces etc. This can be passed to the RequestEvent used in hooks and server routes as the platform property — consult each adapter's documentation to learn more.

Community adapters

Additional community-provided adapters exist for other platforms. After installing the relevant adapter with your package manager, update your svelte.config.js:

svelte.config.js
import adapter from '@sveltejs/adapter-auto';
import adapter from 'svelte-adapter-[x]';

Writing custom adapters

We recommend looking at the source for an adapter to a platform similar to yours and copying it as a starting point.

Adapters packages must implement the following API, which creates an Adapter:

ts
/** @param {AdapterSpecificOptions} options */
export default function (options) {
  /** @type {import('@sveltejs/kit').Adapter} */
  const adapter = {
    name: 'adapter-package-name',
    async adapt(builder) {
      // adapter implementation
    }
  };
 
  return adapter;
}

The types for Adapter and its parameters are available in types/index.d.ts.

Within the adapt method, there are a number of things that an adapter should do:

  • Clear out the build directory
  • Write SvelteKit output with builder.writeClient, builder.writeServer, and builder.writePrerendered
  • Output code that:
    • Imports Server from ${builder.getServerDirectory()}/index.js
    • Instantiates the app with a manifest generated with builder.generateManifest({ relativePath })
    • Listens for requests from the platform, converts them to a standard Request if necessary, calls the server.respond(request, { getClientAddress }) function to generate a Response and responds with it
    • expose any platform-specific information to SvelteKit via the platform option passed to server.respond
    • Globally shims fetch to work on the target platform, if necessary. SvelteKit provides a @sveltejs/kit/install-fetch helper for platforms that can use node-fetch
  • Bundle the output to avoid needing to install dependencies on the target platform, if necessary
  • Put the user's static files and the generated JS/CSS in the correct location for the target platform

Where possible, we recommend putting the adapter output under the build/ directory with any intermediate output placed under .svelte-kit/[adapter-name].

The adapter API may change before 1.0.

previous Page options
next Advanced routing