Skip to content

Serving Sveltekit Via Files as SPA Failing Relative Pathing #13813

Closed
@Pandoks

Description

@Pandoks

Describe the bug

I am trying to make an Electron app with Sveltekit. I am currently using electron-forge and adapter-static.

I basically want to create an SPA with Sveltekit and then let Electron serve the files. The problem right now is that when I use the built code and point Electron to serve index.html, there are files that Electron can't find because the paths are absolute and not relative. Even when using router.type="hash", it seems like Electron is trying to access files that are supposed to be modulepreloaded.

Since router.type="hash" is mainly used for client exclusive apps, I'd assume that it should be able to be loaded by being served the file through file:// instead of needing a web server because isn't that the whole point of making it client rendered?

Reproduction

demo repo

if you run pnpm run package or pnpm run make, the resulting build will vite build the sveltekit app into .vite/renderer/main_window and then runs electron-forge package/make. these files work fine when you run vite preview however when Electron serves the files with mainWindow.loadFile, it seems to not be able to find the files due to the absolute pathing.

you can see the error if you go to the out directory after you've run pnpm run package or pnpm run make and go to out/electron-svelte-<your architecture here> and open the electron app. once the electron window opens, you can open dev tools with the shortcut cmd + alt + i. you can also see the files that electron uses if you go to out/electron-svelte-<your achitecture here>/electron-svelte.app/Contents/Resources and run npx @electron/asar extract app.asar asar and it will dump all the bundled files into the asar directory.

Logs

System Info

System:
    OS: macOS 15.4.1
    CPU: (11) arm64 Apple M3 Pro
    Memory: 1.94 GB / 36.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 23.6.0 - ~/.nvm/versions/node/v23.6.0/bin/node
    Yarn: 1.22.22 - /opt/homebrew/bin/yarn
    npm: 10.9.2 - ~/.nvm/versions/node/v23.6.0/bin/npm
    pnpm: 10.8.1 - /opt/homebrew/bin/pnpm
    Watchman: 2025.04.14.00 - /opt/homebrew/bin/watchman
  Browsers:
    Chrome: 136.0.7103.114
    Safari: 18.4

Severity

blocking all usage of SvelteKit

Additional Information

Hash based routing was advertised to being able useful for Electron apps, but just enabling hash based routing doesn't make it automatically work.

I've heard that using electron-serve can solve the issues as it basically acts as a intermediary web server, but doesn't that ruin the whole point of creating a SPA that's run only on the client. This goes for embedded systems and tv apps too.

Is there a way to serve a Sveltekit app using file://?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions