Svelte SSR

[buhrmi]

This adds Svelte SSR support.

To enable SSR for a Svelte app:

1. Create an ssr.js entrypoint. Here is an example for Vite:

// ssr.js
import { createInertiaApp } from '@inertiajs/svelte'
import createServer from '@inertiajs/svelte/server'
import layout from '../pages/_layout.svelte'

const pages = import.meta.glob('../pages/**/*.svelte')

createServer((page) => createInertiaApp({
  page,
  resolve: async name => {
    const page = await pages[`../pages/${name}.svelte`]()    
    return Object.assign({layout}, page)
  }
}))

Build it with vite build --outDir dist/server --ssr src/ssr.js or a similar command appropriate for your environment.

2. Enable the hydratable compiler option

// vite.config.js
// ...
  plugins: [
    svelte({
      compilerOptions: {
        hydratable: true
      }
    })
  ]
// ...

3. Add the hydrate option when instantiating your app:

// application.js
createInertiaApp({ 
  // .....
  setup({ el, App}) {
    new App({ target: el, hydrate: true })
  },
})

[reinink]

Weww, this is great @buhrmi! I just pulled in @pedroborges's Svelte PR #1344, would you mind updating this PR to resolve conflicts?

I'm excited! 🥳

[buhrmi]

☝️ rebased

[patricknelson]

Hmm... oops! I think I'm going to just delete my previous comment out of shame. 😅

However, I think you could register this as general interest on the topic of sort of parametric (or API-driven) server-side rendering for Svelte components, even if it's not properly placed here. My use case (an API for independent SSR of Svelte components in mixed/hybrid non-Node.js environments) doesn't quite fit Inertia.js generally, but I do find work on this project inspiring!

[reinink]

@buhrmi Thanks again for this! I think I'll probably end up moving things around a little, but this is a great starting point. Thanks so much! 🥳