Skip to content

feat: support passing Svelte(Kit) config via Vite plugin#15944

Merged
Rich-Harris merged 14 commits into
mainfrom
vite-svelte-config
Jun 2, 2026
Merged

feat: support passing Svelte(Kit) config via Vite plugin#15944
Rich-Harris merged 14 commits into
mainfrom
vite-svelte-config

Conversation

@dummdidumm
Copy link
Copy Markdown
Member

@dummdidumm dummdidumm commented Jun 1, 2026

This allows you to pass the Svelte(Kit) config into the sveltekit Vite plugin. Example:

import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import adapter from '@sveltejs/adapter-vercel';

export default defineConfig({
	plugins: [
		sveltekit({
			compilerOptions: {
				experimental: {
					async: true
				}
			},
			adapter: adapter(),
			experimental: {
				remoteFunctions: true,
				handleRenderingErrors: true
			}
		})
	],
});

Note how the kit namespace is at the same level as the other top level entries; this is the only difference to the current svelte.config.js layout.

If you set your options via the plugin, the svelte.config.js contents are ignored, so it's either-or, not a merge.

In SvelteKit 3 we will likely make it a requirement to pass the options via the Vite plugin instead - one less config file at the cluttered top level of your project.

Fixes #5485

Because you can tell Vite which config to use this also fixes #13748

Related: sveltejs/language-tools#3031

This allows you to pass the Svelte(Kit) config into the sveltekit Vite plugin. Example:

```js
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import adapter from '@sveltejs/adapter-vercel';

export default defineConfig({
	plugins: [
		sveltekit({
			compilerOptions: {
				experimental: {
					async: true
				}
			},
			adapter: adapter(),
			experimental: {
				remoteFunctions: true,
				handleRenderingErrors: true
			}
		})
	],
});
```

Note how the `kit` namespace is at the same level as the other top level entries; this is the only difference to the current `svelte.config.js` layout.

If you set your options via the plugin, the `svelte.config.js` contents are ignored, so it's either-or, not a merge.

In SvelteKit 3 we will likely make it a requirement to pass the options via the Vite plugin instead - one less config file at the cluttered top level of your project.

Fixes #5485

Because you can tell Vite which config to use this also fixes #13748
@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented Jun 1, 2026

🦋 Changeset detected

Latest commit: 9bcc42a

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@sveltejs/kit Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@svelte-docs-bot
Copy link
Copy Markdown

Comment thread documentation/docs/98-reference/50-configuration.md
dummdidumm and others added 2 commits June 1, 2026 22:54
…tatement for `sveltekit`, which would cause a ReferenceError when users copy the code.

This commit fixes the issue reported at documentation/docs/98-reference/50-configuration.md:44

**Bug Explanation:** The documentation at `documentation/docs/98-reference/50-configuration.md` shows an example vite.config.js file that demonstrates how to pass config to the `sveltekit` plugin. The example imports `adapter` from `@sveltejs/adapter-auto` and `defineConfig` from `vite`, but it uses `sveltekit({...})` in the plugins array without ever importing it. This would cause a `ReferenceError: sveltekit is not defined` if users copied this example directly into their projects.

Every other vite.config.js file in the repository (at least 10+ files across playgrounds, packages/kit/test/, packages/adapter-static/test/, etc.) correctly imports sveltekit with:

```js
import { sveltekit } from '@sveltejs/kit/vite';
```

**Fix Explanation:** Added the missing import statement `import { sveltekit } from '@sveltejs/kit/vite';` to the documentation example, placing it between the adapter import and the defineConfig import to maintain alphabetical ordering by module path. This ensures users who copy the example code will have a working configuration.


Co-authored-by: Vercel <vercel[bot]@users.noreply.github.com>
Co-authored-by: dummdidumm <sholthausen@web.de>
@Rich-Harris
Copy link
Copy Markdown
Member

I don't understand the type errors... any ideas?

Comment thread packages/kit/src/exports/vite/index.js
Comment thread packages/kit/src/exports/vite/index.js Outdated
Comment thread packages/kit/src/core/config/index.js Outdated
@Rich-Harris Rich-Harris force-pushed the vite-svelte-config branch from bd7541c to 22f9917 Compare June 2, 2026 16:10
Comment thread packages/kit/src/exports/vite/index.js Outdated
/**
* Returns the SvelteKit Vite plugins.
* Since version 2.62.0 you can also pass the Svelte config inline. The svelte.config.js will be ignored in this case.
* @param {KitConfig & Omit<SvelteConfig, 'onwarn'>} [inline_config]
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why do we omit onwarn?

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because we have compilerOptions.warningFilter now, so it feels duplicative. We may want to remove onwarn for this reason at some point, so I'm omitting it here already

export default config;
```

Since version 2.62.0 you can also pass your configuration to the `sveltekit` plugin in your Vite config, along with the Svelte compiler options:
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I actually think we should invert the docs to be Vite-first, but it will cause all sorts of ripple effects so I think it should happen later

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes, that was my thinking aswell 👍

@Rich-Harris Rich-Harris merged commit 6bfb01f into main Jun 2, 2026
49 of 50 checks passed
@Rich-Harris Rich-Harris deleted the vite-svelte-config branch June 2, 2026 19:01
@github-actions github-actions Bot mentioned this pull request Jun 2, 2026
Rich-Harris pushed a commit that referenced this pull request Jun 2, 2026
This PR was opened by the [Changesets
release](https://github.com/changesets/action) GitHub action. When
you're ready to do a release, you can merge this and the packages will
be published to npm automatically. If you're not ready to do a release
yet, that's fine, whenever you add more changesets to main, this PR will
be updated.


# Releases
## @sveltejs/kit@2.62.0

### Minor Changes

- feat: support passing Svelte(Kit) config via Vite plugin
([#15944](#15944))

### Patch Changes

- fix: preserve multiple `Set-Cookie` headers on 304 responses
([#15902](#15902))


- fix: preload for anchor elements that were just previously preloaded
([#15915](#15915))


- fix: catch load function streaming errors on the client
([#15929](#15929))


- fix: avoid generating the `_app/env.js` module if public dynamic
environment variables are not used by the app
([#15940](#15940))

## @sveltejs/package@2.5.8

### Patch Changes

- chore: bump `svelte2tsx` dependency to support TypeScript 6
([#15896](#15896))

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
@BCsabaEngine
Copy link
Copy Markdown
Contributor

svelte-kit sync does not run without deleted svelte.config.js, because:

cli.js bails out early with a file-existence check before calling load_config(), which itself already supports reading from vite config. It's a one-line fix in the PR. The workaround is a stub svelte.config.js — its content is irrelevant since load_config() tries vite config first, but the file must exist to pass the check.

@Rich-Harris
Copy link
Copy Markdown
Member

Whoops! Good catch, opened #15946

Rich-Harris added a commit that referenced this pull request Jun 2, 2026
#15944 (comment)

We missed a spot in #15944 — `svelte-kit sync` shouldn't check to see if
a `svelte.config.js` exists, it should delegate to `load_config`.

---

### Please don't delete this checklist! Before submitting the PR, please
make sure you do the following:
- [x] It's really useful if your PR references an issue where it is
discussed ahead of time. In many cases, features are absent for a
reason. For large changes, please create an RFC:
https://github.com/sveltejs/rfcs
- [x] This message body should clearly illustrate what problems it
solves.
- [ ] Ideally, include a test that fails without this PR but passes with
it.

### Tests
- [x] Run the tests with `pnpm test` and lint the project with `pnpm
lint` and `pnpm check`

### Changesets
- [x] If your PR makes a change that should be noted in one or more
packages' changelogs, generate a changeset by running `pnpm changeset`
and following the prompts. Changesets that add features should be
`minor` and those that fix bugs should be `patch`. Please prefix
changeset messages with `feat:`, `fix:`, or `chore:`.

### Edits

- [x] Please ensure that 'Allow edits from maintainers' is checked. PRs
without this option may be closed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

allow passing configFile option to kit() in vite config allow passing inline options to kit() in vite config

3 participants