How do I use a non-standard API route prefix in TS Start?

[icflorescu]

The documentation says:

By default, API Routes are defined in your ./app/routes/api directory of your project and are automatically handled by the TanStack Start server.

🧠 This means that by default, your API Routes will be prefixed with /api and will be served from the same server as your application. You can customize this base path by changing the server.apiBaseURL in your TanStack Start config.

However, I am unable to make this work.
Assuming I'd like my API URLs to start with /r/ instead of /api/, I'm trying this app.config.ts:

// app.config.ts
import { defineConfig } from '@tanstack/react-start/config';

export default defineConfig({
  server: {
    apiBaseURL: '/r/',
  },
  // ...
});

But my routes are still available at /api/ and unavailable at /r/.

What am I missing?

[kandros]

You need to change the api routes path too, see this issue
#3080

[icflorescu]

Thanks for pointing out the issue.

The documentation says:
You can customize this base path by changing the server.apiBaseURL in your TanStack Start config.

...which is why I tried the above config.

This is what actually ended up working:

// app.config.ts
import { defineConfig } from '@tanstack/react-start/config';

export default defineConfig({
  tsr: {
    apiBase: '/r',
  },
  // ...
});

Which means this docs page is wrong and should be updated to:
You can customize this base path by changing the tsr.apiBase in your TanStack Start config.

[icflorescu]

Just did a PR to address this: #4062