SvelteKit + Electron = 💔

Describe the bug

There's an issue when working from within ElectronJS, as there are non-web routes involved: they're file-based.

For starters, there's one issue inside generated index.html file, there's a line like:

__sveltekit_wgqb1w = {
  base: new URL(".", location).pathname.slice(1, -1)
};

On Windows, it returns url something like that:

'/C:/Users/Jerry/projects/electron-svelte/out/app.asar/.vite'

So the fact that it starts from /C:/ is already an issue since it then return an error:

app.qFRTHcTk.js:7 Error: Not found: /C:/Users/Jerry/projects/electron-svelte/out/app.asar/.vite/index.html

I tried to intervene into Svelte building pipeline, so when building I make corresponding changes to index.html:

-new URL(".", location).pathname.slice(0, -1)
+new URL(".", location).pathname.slice(1, -1)

Now the url is formed properly, but now I'm stuck into some infinite loop by some reason:

Throttling navigation to prevent the browser from hanging. See https://crbug.com/1038223. Command line switch --disable-ipc-flooding-protection can be used to bypass the protection

It tries to load some initial code it seems, but I'm not sure where and why it breaks – since no error occurs. Only a warning:

There's a lot of blinking involved, so clearly: the thing is looped. It's broken. And it doesn't render any html as you can see.

But if I'm not running from statics, instead from web version like this:

mainWindow.loadURL('http://localhost:5173')

Then it works perfectly fine:

So, the issue only seems related to when running from local static files like this:

mainWindow.loadFile(path.resolve(app.getAppPath(), '.vite/index.html'))

Reproduction

Largely I use this minimal electron-forge repo that explains how to use electron with esm:

https://github.com/jdms754/electron-forge-vite-esm-test

It works perfectly for dev and production: i.e. both from mainWindow.loadUrl and mainWindow.loadFile.

So I cloned it, added Svelte, and it works... But only in dev environment (mainWindow.loadUrl).

When it gets to building an executable with statics, I need to load statics like this:

mainWindow.loadFile(path.resolve(app.getAppPath(), '.vite/index.html'))

Then here, the problem occurs. All as described above: first with wrong base path, then with infinite loop.

Logs

No response

System Info

Windows 10 (22H2)
Node: 20.11.1
Electron: 29.1.4
@sveltejs/adapter-auto: ^3.0.0 => 3.1.1
@sveltejs/adapter-static: 3.0.1 => 3.0.1
@sveltejs/kit: ^2.0.0 => 2.5.3
@sveltejs/vite-plugin-svelte: ^3.0.0 => 3.0.2
svelte: 5.0.0-next.80 => 5.0.0-next.80
vite: ^5.0.3 => 5.1.5

Severity

blocking all usage of SvelteKit

Additional Information

Questions to approach to a resolution:
• At which point the infinite loop happens?
• Can we make changes to resolve that?

And please don't suggest to NOT use SvelteKit: I might see this suggestion coming. Because in Electron if you don't have url section so you basically don't need routing right? Just use basic Svelte? But if I want to support both web-version and electron-version of my app, I still would like to use single codebase with SvelteKit – so in web version I can have this cool routing system that SvelteKit provides, and electron-version: it just works. Plus, even without ability to change url in electron-version I still prefer the routing system of SvelteKit rather than pure Svelte – it helps to organize code so much better!

Reproduce the issue on Windows using the linked electron-forge-vite-esm-test repository with Svelte and adapter-static. Start by comparing the generated index.html and static output when loaded through Electron loadFile versus loadURL, then trace the navigation loop. Done means the static Electron build renders without a malformed base path or repeated navigation while the web version still works.