TanStack

T

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

Join

react-query-questions

solid-query-questions

table-questions

virtual-questions

router-questions

react-charts-questions

ranger-questions

vue-query-questions

svelte-query-questions

bling-questions

form-questions

angular-query-questions

start-questions

db-questions

start-showcase

router-showcase

📣-announcements

continuing-cyan
continuing-cyan7/22/2025

No TS checks on the Link component

I created a new Tanstack Start project use the create-tsrouter-app and the links in the header component don't give me the red squiggly line when i delete the associated file route.
No description
harsh-harlequin
harsh-harlequin7/22/2025

ReferenceError: module is not defined

in my server function file called blog-server-actions.server.ts this works: import {readFile} from 'node:fs/promises'; but this does not:...
firm-tan
firm-tan7/22/2025

Client-only router context

With TanStack Router (without Start) we can pass context from a React Context by putting the <RouterProvider> inside the React Context provider and passing the context prop. https://tanstack.com/router/latest/docs/framework/react/guide/router-context#how-about-using-react-contexthooks But in TanStack Start there is <StartClient> instead of <RouterProvider> and it doesn't take context. My use case right now is in migrating a Router app to Start so that we can get some dynamic SSR injection into the root route but have all other routes disable SSR with the new selective SSR. Our app's loaders can't be isomorphic so what I am doing now is creating a layout under the root route to initialize the client-side context values but these get recreated every time that beforeLoad runs which is every navigation. This is different than the Router case where we would initialize the router with those context values so the initialization wouldn't be in a loader....
other-emerald
other-emerald7/22/2025

Only generate ServerRoute with DELETE method will make 404 error

``` import... export const ServerRoute = createServerFileRoute( "/admin/_protected/generus/_index/$id",...
multiple-amethyst
multiple-amethyst7/21/2025

Retry next in middleware

Hey! so just saw we now have the ability to access the router instance (and thus the root context) from a client function middleware, which is awesome, thank you!! This reminded me of the other QoL feature regarding middlewares I'd love to see: retrying the next() handler. My use case is to add retry logic for certain kinds of errors (in my case on the client, but it'd apply on the server too) that is encapsulated in the server fn, without having to move that logic up to say the query client. Currently, it seems calling next multiple times doesn't work, the successive calls just return undefined...
other-emerald
other-emerald7/21/2025

Cant click button after following installation

Hi Anyone can help me? After i following all the instruction to install TanStack Start i cant use button event (onClick) it doesn't working or making an event Here's my code: https://codesandbox.io/p/github/jhokam/test-start-2/main?import=true...
environmental-rose
environmental-rose7/21/2025

Better way to get theme?

Im accessing the theme cookie on __root during loader, but every client-side navigation triggers it. ```tsx export const Route = createRootRouteWithContext<RouterAppContext>()({...
exotic-emerald
exotic-emerald7/21/2025

I got new error after update

on console. ``` PM [vite] vite.config.ts changed, restarting server... please add the vite-react plugin to your Vite config and set 'customViteReactPlugin: true' TanStack Start will not configure the vite-react plugin in future anymore....
other-emerald
other-emerald7/21/2025

i cannot find createServerFileRoute

Hi sorry if my question was a newbie but, does anyone know how to import this module come from? when i want to autocomplete it, my code editor doesn't recognise it Thanks 🙂...
No description
optimistic-gold
optimistic-gold7/20/2025

Why is TSS using inline script tags to import script?

We're implementing CSP script loading with nonce injection, and we've seen that scripts are imported like this: <script type="module" async="">import('/assets/main-foobar.js')</script>. Is there a reason why SSR won't use standard <script src="..." type="module" async="></script> tags? This will be really helpful to implement proper strict CSP. Thanks!
equal-jade
equal-jade7/20/2025

Large monorepo/Next.js refactor to TSR questions/issues

Hi, I have been attempting to refactor our fairly large Next.js codebase to TSR, as I think it solves a lot of the issues and needs we have, and want to test if that is the reality as well. I have already written codemods that update: - Link and useRouter usages (+ syntax) - File route structure...
xenial-black
xenial-black7/20/2025

Deploy with vercel throws 'This Serverless Function has crashed.'

Hi I'm trying to deploy my project with vercel. I can run well in my local, and build successed. But, when I deploy to vercel, 'This Serverless Function has crashed.' are shown. I already set deploy target to 'vercel' in my vite.config.js....
No description
sensitive-blue
sensitive-blue7/19/2025

Landing page downloads large bundle

I've migrated an app from Next.js to TanStack Start. The app has a simple landing page and a large (1MB+) admin dashboard. Even though my landing page route doesn't import any admin code, it's still loading the entire admin bundle (=main bundle) on initial visit. What is the idiomatic way in TanStack Start to ensure the large admin bundle is only loaded when a user navigates to the protected /admin route? I'm on file routes and enabled auto code splitting already....
stormy-gold
stormy-gold7/19/2025

Websocket connection to a route

hey guys, need guidance here. Is there an example out there to connect to a route using websocket? here is my attempt: ``` export const ServerRoute = createServerFileRoute('/ws/session/$id').methods({...
foreign-sapphire
foreign-sapphire7/18/2025

Static server functions do not work on Netlify

Has anyone tried using static server functions on Netlify? My web app will either crash immediately or throw a 404 when attempting to query the function. Here's an example of what I have implemented: ``` // ./src/server-functions/getAppVersion.ts...
other-emerald
other-emerald7/17/2025

Middleware losing method

Hi, maybe this is a bug or I could be doing things the wrong way, but why is my middleware only logging the method on some of the requests?
No description
continuing-cyan
continuing-cyan7/17/2025

Error importing `cloudflare:workers`

I am trying to use a Cloudflare Durable Object in development. This requires import { DurableObject } from "cloudflare:workers";, which fails with the following error:
Error: Cannot find module 'cloudflare:workers' imported from '<path/to/sourcefile>`
Error: Cannot find module 'cloudflare:workers' imported from '<path/to/sourcefile>`
...
flat-fuchsia
flat-fuchsia7/17/2025

non serializable objects in Route Context

I have an API client that is required on the client and on the server. All examples I see for tanstack just initializes these things in a global way, but that doesn't work when you need to pass arguments. I have a few config variables that I fetch from the server and with that I can initialize the client. I do this in the root route beforeLoad ...
fascinating-indigo
fascinating-indigo7/16/2025

Render a specific component in ssr true page on client side

so basically I have a component in a page which I have rendered on ssr but one of its component is giving error while rendering in ssr the component ``` import { Alignment,...
sensitive-blue
sensitive-blue7/16/2025

Clerk docs say server.ts, migration guide says src/server.tsx

I'm finally migrating to latest veriosn of tanstack and clerk. Should I use src/server.tsx or follow clerk documentation. Does it matter? ``` //src/server.ts from https://clerk.com/docs/quickstarts/tanstack-react-start import { createStartHandler, defaultStreamHandler } from '@tanstack/react-start/server'...