SvelteKit: disable SSR

Question

I made an app in Svelte and now I wanted to port it to SvelteKit. My app uses window and document objects, but those aren't available in SSR. Firstly, it threw ReferenceError: window is not defined, but I fixed that by checking if the app is running in the browser. But because of that, my app is not working.

Answer 1

The previous answer no longer works because of changes to SvelteKit. See this PR for more information: https://github.com/sveltejs/kit/pull/6197 and also the documentation: https://kit.svelte.dev/docs/page-options

Basically now you disable SSR at the page/layout level, so instead of in src/hooks.server.js: (hooks.js was also separated into client and server with the addition of client side hooks.)

export function handle({ event, resolve }) {
  return resolve(event, { 
    ssr: false
  });

You now do:

// src/routes/+layout.js
export const ssr = false;

Make sure to put the line above in +layout.js and not +layout.svelte.