Non-default Vite `base` parameter causes prerender to fail in SPA mode

[andriygm]

Which project does this relate to?

Start

Describe the bug

(creating issue from discord discussion here https://discord.com/channels/719702312431386674/1421224773895192627/1421224773895192627)

When setting vite's base option in vite.config.ts:

export default defineConfig({
  base: '/custombasepath',
  ...
})

I get the following error:

[prerender] Prerendering pages...
[prerender] Concurrency: 8
[prerender] Crawling: /
[prerender] Prerendered 1 pages:
[prerender] - /
[sitemap] Hint: Pages found, but no sitemap host has been set. To enable sitemap generation, set the `sitemap.host` option.
file:///Users/andriymassimilla/Projects/a2-ai/portkey/frontend/node_modules/@tanstack/start-plugin-core/dist/esm/prerender.js:109
            throw new Error(`Failed to fetch ${page.path}: ${res.statusText}`, {
                  ^

Error: Failed to fetch /: 
    at file:///Users/andriymassimilla/Projects/a2-ai/portkey/frontend/node_modules/@tanstack/start-plugin-core/dist/esm/prerender.js:109:19
    at async file:///Users/andriymassimilla/Projects/a2-ai/portkey/frontend/node_modules/@tanstack/start-plugin-core/dist/esm/queue.js:38:17 {
  [cause]: Response {}
}

Node.js v24.9.0

note that createRouter includes the rewriteBasepath rewrite function (the other basepath parameter is marked as deprecated):

  const router = createRouter({
    routeTree,
    scrollRestoration: true,
    rewrite: rewriteBasepath({
      basepath: "/custombasepath",
    }),
  });

Your Example Website or App

https://stackblitz.com/edit/vitejs-vite-jvynrgn2?file=package.json

Steps to Reproduce the Bug or Issue

1. pnpm i
2. pnpm run build

Expected behavior

As a user, I expected the build to complete without error even when specifying a custom base path, but instead an error is thrown.

Screenshots or Videos

No response

Platform

• Router / Start Version: 1.132.7/1.132.10
• OS: macOS
• Browser: Arc (chromium)
• Browser Version:
  Version 1.114.0 (69006)
  Chromium Engine Version 140.0.7339.208
• Bundler: vite
• Bundler Version: 7.1.7

Additional context

No response

[krishna-santosh]

Not sure if this is related, but I noticed a change in behavior:

When the base is set to /custombasepath, versions prior to 1.132.x would render the index page when visiting /custombasepath. After the update, however, accessing /custombasepath (without the trailing slash) now returns a notFoundError, while /custombasepath/ still works.

[schiller-manuel]

@krishna-santosh which kind of base do you mean here? router's basePath ?

[krishna-santosh]

@krishna-santosh which kind of base do you mean here? router's basePath ?

yes, the one specified in vite config and also while creating a new router instance

const router = createRouter({
	routeTree,
	basepath: "/custombasepath",
});

[andorep]

Not sure if this is related, but I noticed a change in behavior:

When the base is set to /custombasepath, versions prior to 1.132.x would render the index page when visiting /custombasepath. After the update, however, accessing /custombasepath (without the trailing slash) now returns a notFoundError, while /custombasepath/ still works.

As @krishna-santosh mentioned, looks like that's the issue

I figured it out by debugging the library myself. The error happens because it needs a slash at the end when fetching the root. If I add that, everything else works automatically

I change this line

router/packages/start-plugin-core/src/prerender.ts

Line 149 in 581941a

const res = await localFetch(withBase(encodedRoute, TSS_APP_BASE), {

by adding a condition for the root path:

let basef = withBase(encodedRoute, TSS_APP_BASE)
if (basef === TSS_APP_BASE) {
  basef = TSS_APP_BASE + '/'
}
const res = await localFetch(basef, {
  headers: {
    ...prerenderOptions.headers,
  },
})

Sorry if this is not the solution but I hope it helps 😅
BTW: I already have the rewrite rule added to my project, so that's not the issue.

[krishna-santosh]

@andorep Thanks for looking into this 🙌 I’m running into this issue with TanStack Router (React SPA), so it might be coming from there and not only from TanStack Start.

[jin-benben]

this same issues with TanStack Start.

[andorep]

If anyone is interested I found a quick fix to this: #5302

If it doesn't get merged, the workaround that helped me was to recreate the function myself and pass it to the createRouter function.

function rewriteBasepath(opts: { basepath: string; caseSensitive?: boolean }) {
  const trimmedBasepath = trimPath(opts.basepath)
  const regex = new RegExp(
    `^/${trimmedBasepath}(?:/|$)`,
    opts.caseSensitive ? '' : 'i',
  )
  return {
    input: ({ url }) => {
      url.pathname = url.pathname.replace(regex, '/')
      return url
    },
    output: ({ url }) => {
      url.pathname = joinPaths(['/', trimmedBasepath, url.pathname])
      return url
    },
  } satisfies LocationRewrite
}
// Create a new router instance
export const getRouter = () => {
  return createRouter({
    routeTree,
    rewrite: rewriteBasepath({ basepath: import.meta.env.BASE_URL || '/' }),
    scrollRestoration: true,
    defaultPreloadStaleTime: 0,
  })
}

[andriygm]

@andorep I think you're describing a related but different issue -- in this repro, even setting with trailing slash produces the same error. are you testing with modifications to base in vite.config.ts?

[schiller-manuel]

can you please test again with the latest version?

[andriygm]

seems like it's working correctly as of 1.132.29! thanks for the quick fix!