SPA mode + basename feature gives match issue in dev and 404 error on build

[ajhaining]

Reproduction

Related to #8145

Dev build issue

1. Go to https://stackblitz.com/edit/remix-run-remix-7qirzt
2. Open terminal and see dev build fail with:

<Router basename="/test"> is not able to match the URL "/" because it does not start with the basename, so the <Router> won't render anything.

Production build issue

1. Open terminal run npm run build and see:

Error: SPA Mode: Received a 404 status code from `entry.server.tsx` while generating the `index.html` file.

System Info

Template generated from SPA mode example using nightly build 0.0.0-nightly-f7c2827-20240207

Used Package Manager

npm

Expected Behavior

1. Dev SPA mode works without having to set Vite's base value
2. Production build for SPA works

Actual Behavior

1. Dev SPA mode fails with:

<Router basename="/test"> is not able to match the URL "/" because it does not start with the basename, so the <Router> won't render anything.

2. Production build fails with:

Error: SPA Mode: Received a 404 status code from `entry.server.tsx` while generating the `index.html` file.

[brophdawg11]

Ah ok yeah I bet this is a one line change to add the basename to the initial Request used to generate index.html in SPA mode. Feel free to give this a shot in your local node_modules or via patch-package and see if that does the trick. I'm logging off for the day but will look at this tomorrow - thanks for the issue!

https://github.com/remix-run/remix/blob/dev/packages/remix-dev/vite/plugin.ts#L1718

[ajhaining]

I bet this is a one line change to add the basename to the initial Request used to generate index.html

This does the trick @brophdawg11

Added the patch to here: https://stackblitz.com/edit/remix-run-remix-bqalcj but for some reason it won't pick it up for the dev build on Stackblitz, but works fine on the prod build. Both work fine locally.

[brophdawg11]

Fixed in #8720