Integrations

// vite.config.js
import { function sveltekit(config?: Config): Promise<Plugin[]>
The SvelteKit Vite plugin, which must be added to your vite.config.js file along with your project’s configuration:
vite.config
import adapter from '@sveltejs/adapter-auto';
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';

export default defineConfig({
	plugins: [
		sveltekit({
			adapter: adapter(),
			compilerOptions: {
				experimental: {
					async: true
				}
			},
			experimental: {
				remoteFunctions: true
			}
		})
	]
});
As well as SvelteKit, the plugin options are used by other tooling that integrates with Svelte such as editor extensions.
Any options that don’t belong to SvelteKit are passed through to vite-plugin-svelte, so you can set options like inspector here too. The experimental namespace is shared — SvelteKit reads its own flags and forwards the rest.
Legacy mode

Prior to SvelteKit 3, config lived in a svelte.config.js file, which is no longer supported. The ability to configure SvelteKit via vite.config.js was added in version 2.62.
referencesveltekit } from '@sveltejs/kit/vite';
import { function vitePreprocess(opts?: VitePreprocessOptions): PreprocessorGroupvitePreprocess } from '@sveltejs/vite-plugin-svelte';
import { function defineConfig(config: UserConfig): UserConfig (+5 overloads)
Type helper to make it easier to use vite.config.ts
accepts a direct 
{@link 
UserConfig
}
 object, or a function that returns it.
The function receives a 
{@link 
ConfigEnv
}
 object.
defineConfig } from 'vite';

export default function defineConfig(config: UserConfig): UserConfig (+5 overloads)
Type helper to make it easier to use vite.config.ts
accepts a direct 
{@link 
UserConfig
}
 object, or a function that returns it.
The function receives a 
{@link 
ConfigEnv
}
 object.
defineConfig({
	UserConfig.plugins?: PluginOption[] | undefined
Array of vite plugins to use.
plugins: [
		function sveltekit(config?: Config): Promise<Plugin[]>
The SvelteKit Vite plugin, which must be added to your vite.config.js file along with your project’s configuration:
vite.config
import adapter from '@sveltejs/adapter-auto';
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';

export default defineConfig({
	plugins: [
		sveltekit({
			adapter: adapter(),
			compilerOptions: {
				experimental: {
					async: true
				}
			},
			experimental: {
				remoteFunctions: true
			}
		})
	]
});
As well as SvelteKit, the plugin options are used by other tooling that integrates with Svelte such as editor extensions.
Any options that don’t belong to SvelteKit are passed through to vite-plugin-svelte, so you can set options like inspector here too. The experimental namespace is shared — SvelteKit reads its own flags and forwards the rest.
Legacy mode

Prior to SvelteKit 3, config lived in a svelte.config.js file, which is no longer supported. The ability to configure SvelteKit via vite.config.js was added in version 2.62.
referencesveltekit({
			preprocess?: Arrayable<PreprocessorGroup> | undefined
An array of preprocessors to transform the Svelte source code before compilation
@see
https://svelte.dev/docs/svelte/svelte-compiler#PreprocessorGrouppreprocess: function vitePreprocess(opts?: VitePreprocessOptions): PreprocessorGroupvitePreprocess({
				VitePreprocessOptions.style?: boolean | InlineConfig | ResolvedConfig | undefined
preprocess style blocks with vite pipeline
style: true,      // default value
				VitePreprocessOptions.script?: boolean | undefined
preprocess script block with vite pipeline.
Since svelte5 this is not needed for typescript anymore
@default
falsescript: false     // default value
			})
		})
	]
});