I have a pretty standard out of the box Svelte dev environment setup based on these docs in early 2024.
My vite.config.js file currently looks like this:
import { sveltekit } from '@sveltejs/kit/vite';import { defineConfig } from 'vite';export default defineConfig({ plugins: [sveltekit()]});
My svelte.config.js file currently looks like this:
import adapter from '@sveltejs/adapter-auto';import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';/** @type {import('@sveltejs/kit').Config} */const config = { kit: { adapter: adapter() }, preprocess: [vitePreprocess()]};export default config;
I see that the svelte-hmr
plugin supports preserving state but it's disabled by default. I also know that this plugin is somewhere in my build tooling because it's in package-lock.json as a dependency of vite-plugin-svelte
.
I'm totally new to SvelteKit and Vite. I just can't figure out where to set that config flag.
I can add // @hmr:keep-all
into the tag in my one and only component right now and it works. I'd prefer to set it globally.
I acknowledge that preserving state has caveats. I'm too used to React dev environments with that kind of setup, and I can't work with SvelteKit without it.