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

conscious-sapphire

3/20/2025

Type Issues for an utility test function

Hi 👋 I've created a buildSimpleRouterWithContext utility for testing that works great for basic routes to avoid recreating all of the route tree in every test: ```typescript...

ratty-blush

3/19/2025

Flickering when navigating using Link

Hi guys! I was trying out Tanstack Router examples for SolidJS: 1. https://tanstack.com/router/latest/docs/framework/solid/examples/basic-solid-query-file-based 2. https://tanstack.com/router/latest/docs/framework/solid/examples/kitchen-sink-file-based I wonder why when navigating pages in example 1 the entire page seems to be flickering but it does not happen in example 2. Can anyone give me explanation ? thanks!...

metropolitan-bronze

3/18/2025

How do I cleanup resources on route change? ie event listeners

I'm using tanstack file based routing and have a page that instantiates a bunch of resources that need to be disposed when i change routes. How do I deal with this? I'm already trying useEffect cleanup functions without success

helpful-purple

3/18/2025

beforeLoad call frequency

Can someone refer to me some documentation about when and how many times does beforeLoad runs, does it run on every route match or more than that. it seems my root route beforeLoad function gets called twice on every route match and even more. could someone help here on how and when does it get called?

absent-sapphire

3/18/2025

Show custom UI popup before reloading page not possible

Hey guys! I successfully implemented a custom UI popup when navigating from one page to another but not when reloading a page, it still shows the default browser popup. Is this a limitation of useBlocker?

fascinating-indigo

3/18/2025

HMR full reload

Hot Module Replacement (HMR) updates are always causing a full reload instead of updating modules incrementally. This happens even when changing something as basic as style. Is this normal or is there something I'm missing?...

extended-salmon

3/18/2025

Pre-rendering or static generation some part of the routes

Hi folks. Are you guys ever trying to do static generation with Tanstack React Router? I have no luck finding any good reference about it. I have an app and want to create the help & support page to be static that live within the app. What I've done so far; not much but I just confused to get things right when getting the HTML of the page. The /docs/$slug component is using MDX and I have no issue in local development....

conscious-sapphire

3/17/2025

Need help with Shadcn UI styling in Tailwind v4 and Tanstack start monorepo

I'm excited to share a project I've been working on called "Tanstack Forge" - it's a modern monorepo template built around Tanstack Router and React 19. I've put together what I think is a pretty nice stack with Tanstack Query, Tailwind CSS v4, Shadcn UI, and more! I'm running into a bit of an issue with the Shadcn UI styling though. While regular Tailwind classes are working fine, the Shadcn UI component styles don't seem to be applying correctly. I'm not sure if the problem is with my globals.css setup, the tailwind configuration, or something else entirely. Has anyone here integrated Shadcn UI with Tailwind v4 in a monorepo setup? Any common problems I should look out for? ...

harsh-harlequin

3/16/2025

Nested Layouts

If I wanted a nested layout could I create another __root.tsx file within a directory. I’m coming from Next so a bit confused how layouts work. In Next layout is a reserved filename.

harsh-harlequin

3/16/2025

Providers?

So for tanstack router all providers are in the context? So no wrapping like in react router or NextJS?

deep-jade

3/15/2025

How to add a _pathlesslayout on the route node

I want make my pathless route a navbar on my root node that i can keep so it doesn't get re-rendered al the time. Is virtual routes the only way to do this?

flat-fuchsia

3/15/2025

How to get search params to loader?

Here , when i console log ctx.deps is empty, how to fix it

conscious-sapphire

3/15/2025

zod schema for redirect

Does Tanstack Router generate a schema for zod to validate the routes? If not, could it? My thought is to use for a redirect parameter

foreign-sapphire

3/15/2025

Invariant failed: Could not find an active match from "/register"

Hi , I'm using the router with file-based routing and pathless layout routes. I have an _auth.tsx layout that wraps authentication-related routes like /login, /register, and /forgot-password. However, my /login route is not matching, and I keep getting this error: Invariant failed: Could not find an active match from "/login" __root.tsx...

genetic-orange

3/14/2025

How could the beforeunload event best be handled when a blockenFn is supplied?

I stumbled upon https://github.com/TanStack/router/issues/3761 and I commented what I found out about this issue and it seems to not be a straight forward as it initially seems. Is Discord maybe the better place to discuss how this should be handled?

deep-jade

3/14/2025

<Form/> API or Actions implementation

Now that we have a Solid-Router and a Solid Start and forms at 1.0, are we going to get an official Form api or actions in V2.

fair-rose

3/13/2025

Store links in an array

I'm trying to define a long list of links in an array for an onboarding flow so that I'm able to programmatically define a layout where you have the navigation to the left (list of links in order) and so that the layout automatically provides "previous" and "next" buttons for each step of the flow. Is there a way to type: ```ts...

like-gold

3/13/2025

<Await> hiding the entire page until data is resolved

```tsx import { Await, createFileRoute } from "@tanstack/solid-router"; const loader = async () => { await new Promise((r) => setTimeout(r, 2000));...

fascinating-indigo

3/12/2025

useParams returns any

Hi everyone, ``` export const Route = createFileRoute("/myRoute/$id")({ component: MyComponent, });...

adverse-sapphire

3/12/2025

How to get type of params of a route?

I want to use the type of route params as component props. How to get them?

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