vite preview serves .svelte-kit, not build, leading to incorrect behaviour with adapter-static

[hybridherbst]

Describe the bug

The docs explain that npm run preview should be used after npm run build, however, at least in the case of adapter-static the behaviour is different – the generated things in .svelte-kit are served instead leading to very different behaviour, for example with routes and error handling (e.g. in a static build any missing route goes to the fallback page, no matter if there's a matcher or not).

There is a partial workaround by using the serve package and replacing vite preview with serve build, but that is only a partial solution as it doesn't support base paths, has a different HTTPS setup, and the like.

Potentially related to #3535

Logs

No response

System Info

System:
    OS: Windows 10 10.0.22621
    CPU: (16) x64 Intel(R) Core(TM) i9-9900K CPU @ 3.60GHz
    Memory: 34.88 GB / 63.85 GB
  Binaries:
    Node: 18.13.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 8.5.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22621.2134.0), Chromium (116.0.1938.69)
    Internet Explorer: 11.0.22621.1

Severity

annoyance

Additional Information

The last thing npm run build logs is:

Run npm run preview to preview your production build locally.

which is not really true given these limitations.

[Conduitry]

It's intended that preview run the contents of .svelte-kit, which is your built app before any adapter has run on it. The choice of adapter is irrelevant. We should make this clearer in the docs and/or in the CLI output, though.

[hybridherbst]

Thanks! From my side I think it would be better that npm run preview actually gives me an accurate preview... I figured this out after running into many issues with differences between local preview (that I incorrectly assumed to be the static build), would definitely be helpful.

[Conduitry]

For most of the adapters, there's not really a simple way to run the actual adapted build output locally, as it depends on runtimes present on whatever that cloud provider is.

For the Node adapter, you can just directly run the build output with node build. And for the static adapter, you can just point the static file server of your choice at the output directory. I don't think there's much value in providing a command that can do either of these (especially since for the static adapter output, it sloughs over the issue of how your real production static file server is configured).

But making it clearer what preview does and does not do would be helpful. There's a little bit of information in https://kit.svelte.dev/docs/building-your-app#preview-your-app but there obviously could be more.

[Tetrapak0]

Which version of Vite are you using? Sveltekit uses Vite 4.4.2 by default. When I tried using 4.5.1 or newer, I also got some strange behavior, like no CSS until I went to another page and back, or when using 5.0.2, the page would not even load on prod, because of a different base path.