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

extended-salmon
extended-salmon7/20/2025

Access Search Params from Head

How do i access SEARCH params from router HEAD func? I dont see any way to get access this -- any help would be appreciated...
generous-apricot
generous-apricot7/19/2025

Issue with Route masking

Good day, I'm encountering some issues with route masking. I did my best to describe the problem here with a reproduction: https://github.com/TanStack/router/discussions/4655. I would appreciate any help I can get. Thank you.
fascinating-indigo
fascinating-indigo7/19/2025

NotFoundComponent defined at the route level not rendering.

Consider this folder structure. ``` __root.tsx -> notFoundComponent defined settings/ route.tsx -> notFoundComponent defined and <Outlet /> returned...
genetic-orange
genetic-orange7/19/2025

Optional path params with groups

Is it possible to use optional path params with route groups so that I don’t have to repeat the param in every route path? In the file based example i tried moving about.tsx into a ({-$locale}) similar to the advanced i18n with route groups example, but it's not matching /test/about like it does when the folder is named {-$locale}. Am I misunderstanding how ({-$locale}) works in route groups?...
fascinating-indigo
fascinating-indigo7/18/2025

Is it possible for a parent route to wait for all of its children loaders?

I have a root route that loads user authentication data, so this is loaded regardless of which route is accessed. On the initial load, I would like to load all of the data necessary in one go to show a single loading spinner and have it render the entire page without different parts flickering. Here's a screen recording of the behaviour. What I would expect instead is for the white screen "Loading..." to not disappear until all relevant loaders have finished Related github issue: https://github.com/TanStack/router/issues/1705...
foreign-sapphire
foreign-sapphire7/18/2025

Global "onError" handler

Hello! I'm looking to implement the following logic: ```ts...
conventional-tan
conventional-tan7/18/2025

How to load more than one external resource in loader with React Query?

Hi There! I'm trying to find out how to load more than one resource from the backend for one route, with Tanstack Query and unfortunately they do depend on each other. Here is the example code from the docs for using Query, but I really could not find any way to have more than one query depending on each other before the route is rendered. Could somebody point me in the right direction? Thanks!...
deep-jade
deep-jade7/17/2025

Automatic code splitting causing route files to import from my entry point (circular)

Hey, everyone! I'm running into a strange issue with automatic code splitting. Essentially, I have a SPA which has an entrypoint of lead-journey.js. My vite config is adding these imports to my index.html: ``` <script type="module" crossorigin src="/assets/lead-journey.js?v=17719289870"></script> <link rel="modulepreload" crossorigin href="/assets/utils-C-Suy_BF.js?v=17719289870">...
sensitive-blue
sensitive-blue7/16/2025

Typing the `location` in the `loader` function in `createFileRoute`.

Hi, I've searched all through the internet but I cannot find a solution. I currently have this Route declaration: ```tsx export const Route = createFileRoute('/configuration/locations/')({ validateSearch: rootSearchSchema,...
deep-jade
deep-jade7/15/2025

Specify the `component` dynamically, based on route context

hii i have a use case in which i need to decide what component to render after fetching the data for the route. how do you think it should be implemented? currently, i'm thinking on using a code-based splitting approach. something like...
deep-jade
deep-jade7/14/2025

Generator not working with path params

I'm trying to make a path for /folder/$id but it throws this error Error: EPERM: operation not permitted, rename then if I restart it sets the path to /folder...
rare-sapphire
rare-sapphire7/12/2025

Updating router context after top level App re render?

Hi, I'm hitting a gnarly corner case with @tanstack/react-router, that may be indicative that I'm holding it wrong. Here's the high level: I'm querying user profile information once and storing it in a Context to avoid having to drill it throughout my whole application. For onboarding, I have a route that submits the requisite data to the onboarding endpoint, which sets the onboardingRequired flag to false in the backend. I'm hoping then to coordinate re-fetching the user profile (and triggering a re-render of the whole app, which is OK). The issue is that I have a pathless _login route that enforces users are logged in for all child routes. In _login's beforeLoad, I check for onboardingRequired and redirect to the onboarding route as required. However, after the onboarding form is submitted, the following actions are performed:...
fascinating-indigo
fascinating-indigo7/12/2025

Blocker function

Hello dear Tanstack community, I have a tanstack router application. I have a form in my detail page and different tabs in this detail page. Since different tab resets the form, I used useBlocker in which there is some unsaved changes. It works in between switching page but not rehresing page (F5 when on the page). I decided to consult in here to get some information whether I am on right track or not?...
No description
conscious-sapphire
conscious-sapphire7/12/2025

Google Chrome crashing when interacting with forms

I'm developing an application using React and Vite. I added the Tanstack Router. After that, every time I interact with a form element, such as an input or a submit event, my browser crashes and I can't interact anymore. This only happens in Google Chrome or browsers based on them, such as Arc Browser. For Firefox-based browsers, it works normally....
foreign-sapphire
foreign-sapphire7/12/2025

Is there a way to `navigate` or go `back` when the next location matches the previous location?

Sometimes we want the next navigation to use back to clean up the history stack. The implementation we have is to track the last location with useLocation and intercept calls to navigate and use history.back instead but it requires: - interpolating the NavigateOptions like to, params, ... - tracking the last location with useLocation and an effect...
helpful-purple
helpful-purple7/12/2025

Code-splitting issue

I recently upgraded from 1.120.18 to 1.126.8. We had been stuck for a while on 1.120 because of the false positive "could not find match from" issue that got solved a few days ago (https://github.com/TanStack/router/pull/4610). But I noticed a big increase in the size of the main JS chunk after build. So far I have traced it down to somewhere between 1.121.2 (ok) and 1.121.12 (ko). Looking a little at which chunks remain, it looks like only the stuff we code-split manually (not through tanstack) is now emitted as a separate chunk, and everything else is in the main chunk. I'm attaching a visualization (done w/ rollup-plugin-visualizer) of the before and after. It's about a 5x increase in gzipped size....
No description
ambitious-aqua
ambitious-aqua7/12/2025

[TanStack Router] SSR import error

Hey! I'm trying to implement SSR using the TanStack Router following this guide: https://tanstack.com/router/latest/docs/framework/react/guide/ssr However, I'm running into an import error right at the start: ...
correct-apricot
correct-apricot7/11/2025

link preload in layout not reacting to url

attached a video, but i have this layout with some shared links it pulls down the link options partly from the url, so when you hit a new url, you get new options to send to the right settings page this all works fine functionally, but i noticed that only the settings page on the first page load is getting preloaded. subsequent client navs from group to group is getting a shared link preload...
helpful-purple
helpful-purple7/11/2025

Performance issue w/ `parsePathname` in `path.ts`

I tried to upgrade from 1.120.18 to 1.126.2. We had been stuck for a while on 1.120 because of the false positive "could not find match from" issue that got solved yesterday (https://github.com/TanStack/router/pull/4610). But in the CI for this upgrade, all our E2E were timing out. I tried it, it does feel very sluggish. It turns out that there seems to be a big performance regression in path.ts where the parsePathname function takes a lot of time (and is called a lot). Here's a performance trace from the chrome devtools on a staging build (not local dev, just to be sure I'm measuring something prod-like)....
No description
deep-jade
deep-jade7/10/2025

set defaultViewTransition to false when search params are updating.

I'm doing a search feature, but when I trigger the navigate (with new search params so), there is always the view transition (so my input is doing opacity 0 to 1 on each key..). I tried this but doesn't work : ```ts...