Can't GET non root "/" routes with Vite 4 in local production build (vite preview)

[Moshyfawn]

Describe the bug

After building a Vite 4 app with multiple routes, serving the build preview results in Cannot GET [route path] when accessing the route directly via URL (not using router Link / navigate)

Your Example Website or App

https://codesandbox.io/p/sandbox/router-build-vite4-build-preview-p1clwt?file=%2Fsrc%2FApp.tsx&selection=%5B%7B%22endColumn%22%3A1%2C%22endLineNumber%22%3A19%2C%22startColumn%22%3A1%2C%22startLineNumber%22%3A19%7D%5D

Steps to Reproduce the Bug or Issue

1. Go to sandbox
2. Run build command
3. Run preview command
4. Open the preview window in a separate tab
5. Navigate to /params/list
6. Reload the page to get the behaviour
7. See the error

Warning
Cannot GET "/param/list"

Screen-cast of the process

I've attached a screen-cast of the process on how to reproduce the behaviour via the provided codesanbox

Expected behavior

I expect all routes to be defined and accessible in production build of the app

Screenshots or Videos

router-vite-4-build-preview-404-screencast.mp4

Platform

• OS: macOS
• Browser: Firefox
• Version: 108.0b9

Additional context

I'm not sure if it's primarily a TS Router bundling issue or a Vite 4 one

[Moshyfawn]

Alright, it was a Vite issue reported in vitejs/vite#10564 and fixed in the latest 4.0.1 release.

Here's a working repro with

"devDependencies": {
  "vite": "4.0.1"
}

cc: @rifaldhiaw