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

fair-rose
fair-rose11/7/2025

Tanstack start useSyncExternalStore error in dev

Im getting this strange error when trying to run my application in dev. When i build and run the vite preview it works normally. Im not sure what caused this. I tired to clear my node_modules but it didnt help.
index.mjs?v=d45e0807:2 Uncaught (in promise) SyntaxError: The requested module '/@fs/Users/jamal/Developer/GitHub/project/node_modules/.pnpm/use-sync-external-store@1.6.0_react@19.2.0/node_modules/use-sync-external-store/shim/index.js?v=d45e0807' does not provide an export named 'useSyncExternalStore' (at index.mjs?v=d45e0807:2:10)
index.mjs?v=d45e0807:2 Uncaught (in promise) SyntaxError: The requested module '/@fs/Users/jamal/Developer/GitHub/project/node_modules/.pnpm/use-sync-external-store@1.6.0_react@19.2.0/node_modules/use-sync-external-store/shim/index.js?v=d45e0807' does not provide an export named 'useSyncExternalStore' (at index.mjs?v=d45e0807:2:10)
...
No description
deep-jade
deep-jade11/6/2025

SPA mode monorepo not building: "Cannot access 'pg' before initialization"

When I run pnpm build I get ReferenceError: Cannot access 'pg' before initialization. When I add ssr: { external: ['pg'] } to my vite config, it says: ```Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'pg' imported from /home/codebench/Dev/ts-start-bug/apps/web/.nitro/vite/services/ssr/assets/router-w0xdFAbu.js...
manual-pink
manual-pink11/6/2025

SCSS in Tanstack, Hydration Issue & FOUC

is there a recommended way to use SCSS files in tanstack? if I import the SCSS file barebones like import "../styles.scss", I see FOUC (flash of unstyled content), but if I link it as a stylesheet by using import appCss from "../styles.scss" I get hydration errors....
ratty-blush
ratty-blush11/6/2025

How to use only certain files as routes?

How to use only specific files like __root.tsx, index.tsx, and route.tsx as route files?
quickest-silver
quickest-silver11/6/2025

Data loading for redirection decision

Hello! Which one is the proper place for checking some data in the database and redirecting the user based on the value of the data retrieved? beforeLoad or loader?...
correct-apricot
correct-apricot11/5/2025

Global Middleware

Can someone help me pls, what the hell i am doing wrong -.-. ```ts import { createMiddleware, createStart } from '@tanstack/react-start' import { getRequest } from '@tanstack/react-start/server'...
adverse-sapphire
adverse-sapphire11/5/2025

My Tanstack Start project is slow.

My TanStack Start project taking so long 22s to start, I wonder if there's a problem. My project is not big I use only Typescript, Tailwind, Cloudflare/Wrangler, TanStack Start/Router/Query. React/ReactDom And some tiny depencies, zustand, fflate, font rubik, tailwind-merge...
No description
quickest-silver
quickest-silver11/5/2025

How to pass client data to loader/beforeLoad without URL params?

Hello! Is there a way to pass data from the client to the router (loader or beforeLoad) without using URL params? Right now my URLs look like this:...
ratty-blush
ratty-blush11/5/2025

Server functions API

Where can I find more info of server functions?
stormy-gold
stormy-gold11/5/2025

PARTIAL data update

If you do router.invalidate(), then all the data from the loader will be reloaded, which is not very effective if there is a lot of data, but only part of it has been updated. through experimentation, I came to the conclusion that I need to do a hook to work with server functions in order to first receive data from loader, but then update only them. some server functions:...
rising-crimson
rising-crimson11/5/2025

SSR loading state

Is it possible to get SSR page and to also have loading state? I have a page with data table. Page has search params, like page, limit, sort and order. I want to achieve the behavior that: 1. If user loads page http://localhost:3000/table?page=1&limit=20&sort=name&order=asc then the page is ssr-ed to them...
robust-apricot
robust-apricot11/5/2025

server.ts context declaration merging conflict between react-router and react-start?

Hi - hopefully I understand correctly but I'm trying to pass in a custom context to my server.ts fetch handler. The docs say to do this https://tanstack.com/start/latest/docs/framework/react/guide/server-entry-point#request-context ``` import handler, { type ServerEntry } from "@tanstack/react-start/server-entry" ...
wise-white
wise-white11/5/2025

Server dependency leaking to client?

I have a starter template that worked before: https://github.com/winstonpurnomo/turborepo-starter-v2, but now suddenly doesn't - when I try to load the index page, I get an error: hook.js:608 Module "crypto" has been externalized for browser compatibility. Cannot access "crypto.getCiphers" in client code. This stems from the @workos-inc/node package, which I only use in server functions. Does anyone have an explanation for if there is a proper way to protect a server-only dependency from seemingly leaking to client?...
deep-jade
deep-jade11/5/2025

Locale Loader Runs on Auth Routes

I'm having an issue with TanStack Router where my locale route's loader is being triggered on auth routes like /auth/sign-in, causing unwanted API calls and 401 errors Current structure: - Route file: {$locale}/route.tsx - Auth routes: (authentication)/auth/sign-in.tsx...
No description
like-gold
like-gold11/4/2025

How to get Route Type from Tanstack Start route tree gen

I am building a sidebar, thats configured by a const. I have the following type ``` import { FileRoutesByFullPath } from '@/routeTree.gen'; import { type LucideIcon } from 'lucide-react';...
helpful-purple
helpful-purple11/4/2025

SPA mode still server rendering even with prerendering disabled

Hey, I'm having a difficult time getting tanstack start to work in a completely SPA like way. I am migrating a previous tanstack router app to tanstack start but it just seems to have a hard time NOT using the server. I've read all the SPA guides and done every as suggested but it still keeps getting stuck on certain local storage or context usages. Any help is much appreciated!...
sensitive-blue
sensitive-blue11/4/2025

Proper way to compose 'request' middleware to get context type inference without duplication?

I noticed that by chaining request middleware in order to get context type inference middleware will be run more than once and am wondering if there's a proper strategy for composing them to get type inference but not duplication. I did see in the docs that for server function middleware that can be deduped by adding it to globals. Here's an example: addSessionToContext - makes session from request available in later context...
correct-apricot
correct-apricot11/4/2025

Server Functions missing when called from another server function on Cloudflare Deploy

When calling one server funciton in another and deploying to cloudflare, I get an error "Server function info not found for [number]". The code works fine when run locally. I forked the cloudflare example and added a call to a separate server function https://github.com/TimothyKrell/Tanstack-start-bug...
absent-sapphire
absent-sapphire11/3/2025

How do I make search params optional in navigate()?

Getting the attached error for a route declared like this: ```typescript const SearchSchema = z.object({ page: z.coerce.number().int().min(1).max(9999).default(1),...
No description
genetic-orange
genetic-orange11/3/2025

Any way to show loading page while waiting for beforeLoad

We would like to show some page loading spinners while waiting for some beforeLoad on nested routes. Seems that tanstack just renders empty/blank pages while waiting on all beforeLoads to complete? Any thoughts?