Configure Sveltekit for full SPA mode
At first I thought this was going to be difficult but as with a lot of things with Svelte/Sveltekit it turned out to be straightforward.
In your root layout.ts (or layout.js) file add the following to ensure your app is rendered on the client only.
// SPA mode
// https://kit.svelte.dev/docs/single-page-apps
export const ssr = false; Then in svelte.config.js use adapter-static with a fallback page. Check the documentation for more detail.
import adapter from '@sveltejs/adapter-static';
const config = {
kit: {
adapter: adapter({ fallback: 'index.html' })
}
};
export default config; When you build the app using npm run build your app is output to the build directory. You can now deploy the contents of this directory to a server and it will run as a single page application.
Note that by default a Sveltekit app is configured to run in the root of a server. If it is not hosted in the root be sure to configure your base path.