TanStack

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

Join

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

quickest-silver

8/12/2025

Any idea why "Loading" text is not shown instantly in the following example? Video attached.

```ts export const Route = createFileRoute('/_authed/posts')({ loader: () => fetchPosts(), component: PostsComponent, pendingComponent: () => <div>Loading...</div>,...

wee-sapphire

8/12/2025

In file-based routing, how to avoid duplicating files?

I'm puzzling over this situation. Let's say I have a multi-step edit flow and create flow that have some differences but mostly have the same steps, which are sub-routes. - entity/edit/$id (directory) - route.tsx (outlet, data fetch) - options.tsx...

national-gold

8/12/2025

Does onResolved fire on initial page load in TanStack Router?”

Hi, I have a question about router.subscribe in combination with the default browser routing (createRouter). If I subscribe like this: ```router.subscribe('onResolved', (evt) => {...

conscious-sapphire

8/12/2025

Esbuild JS API error with Tanstack Router Plugin

Hey! When I run the CLI command, I get no errors, but when I run it through js api, I get errors about running generator before initialization. I tried running it with same config as in example on GitHub, but nothing worked.

yelping-magenta

8/11/2025

Non-redirected authentication: parallel routes

https://tanstack.com/router/latest/docs/framework/react/guide/authenticated-routes#non-redirected-authentication This section in the docs mentions you can "choose to not redirect users to a login page, and instead keep the user on the same page and show a login form that either replaces the main content or hides it via a modal". I'd like to present a login modal that gets triggered any time the user is unauthenticated and tries navigating to a protected route....

optimistic-gold

8/11/2025

Using beforeLoad to inject data into context for deeply nested routes has performance issues

In our application, we have routes that are pretty deeply nested that need access to the context from the parent routes. For example, consider the following: https://example.com/dashboard/users/$userId/cars/$carId/parts/$partId ...

passive-yellow

8/11/2025

Search params are automatically converted to number type.

I have a search param that is and id, for now the ids are numbers, eg 123, but they could also be uuids, which are just strings. If I type my id param as a z.string(), but pass 123 the validation fails, since it converts it to a number. How can I force it to accept it as a string? Using z.coerce changes the param to %22123%22 which I don't want.

passive-yellow

8/11/2025

How to redirect and pass search params?

I have a legacy route that has to be redirected to a new route, and I need to pass all search params passed to that route, how do I achieve this using a zod validator?

solid-orange

8/11/2025

Exclude children from custom link component

Hey 👋 Is it possible to exclude children from a custom link component created with createLink()? We have a IconLink component that accepts a label property of type string and we don't want to accept children....

wise-white

8/11/2025

Filtered Memory History in Tanstack Router

Heylo, I have a component in my app that renders through a modal which is intended to be a mini-version of the app controlled through memory history. I've achieved this using two RouterProviders using the same route tree. I'd like to implement a behaviour where if I navigate out of specific routes, it will lead me to a ContinueOutside component, which will have a link to navigate me out (thereby taking me out of the memory history'd router) I've got a very crude implementation as follows and would like to know if there was a better and typesafe way to do this in Tanstack Router....

vicious-gold

8/10/2025

Production build FOUC

I seem to be having an issue with production builds having FUOC on the initial render. My Production builds are launched via Vercel I am using the following: "@tanstack/react-query": "^5.66.0",...

vicious-gold

8/10/2025

Google Tags and scripts

What is the proper way to add google tags and analytics to a site? The scripts in header doesn't seem to like scripts with content in it.

wee-sapphire

8/8/2025

What is params={true} in a Link component?

This property is used in the Kitchen Sink examples in the docs, but I can't find documentation on params as a boolean. ```jsx React.useEffect(() => { navigate({...

optimistic-gold

8/8/2025

Is it possible to provide a manual name for the chunk(s) emitted for a code split route? (with Vite)

I'm considering the possibility of conditionally allowing access to certain parts of the bundle via middleware but I would need a way to reliably identify what the chunk contains by its name. Is this currently possible or is it a feature that might be considered?

blank-aquamarine

8/8/2025

Remove tailing /

Is it possible to make routes with wildcards dont show the last / if the splat is undefined? Lets say i have the route /search/$.tsx if i do ``` navigate({...

absent-sapphire

8/7/2025

router.invalidate() doesn't refresh the data from Route.useLoaderData()

New to tanstack router, so I might be missing something. I have a loader on a Route that returns some data from context (e.g. auth data/logged in user). When I update the context and invalidate the router (using router.invalidate()), the TanStackRouterDevtools show the new data is in the context, and when I navigate to a new route the new data is displayed, but the data from Route.useLoaderData() isn't refreshed/updated (without a refresh or a navigation to then back to the page)

wee-sapphire

8/7/2025

Understanding Route loader query vs component hook query

Can anyone help me to understand the difference between executing a query in the loader vs in the component? I have these two examples ```javascript //$id.edit.tsx...

sensitive-blue

8/6/2025

Problem with displaying child routes in the Outlet

Hi, I've ran into a problem, where my child routes instead of displaying in the place of the Outlet, just display as a whole new page. I have a dashboard and I want to display content of for e.g settings next to the sidebar, but instead the settings route displays without the sidebar. My file structure: ``` /dashboard index.tsx - main dashboard component with a sidebar...

national-gold

8/6/2025

Is TanStack Router with SSR as good for SEO as Next.js?

Hey everyone, I’m trying to decide between using Next.js and TanStack Router (with SSR) for my project. Here’s my situation:...

like-gold

8/6/2025

Route Path in `createFileRoute` Keeps Auto-Correcting to Remove Layout Folder

Hi all,
I’m running into an issue with TanStack Router’s file-based routing. My file structure is: ``` src/routes/...

Previous Next

Gaming

Programming

TanStack

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

TanStack

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