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
Dehydrating/hydrating queryClient
How can i properly "hand off" the queryClient to the client, using TanStack Start with
ssr: "data-only"?
Currently I don't do any hydration. This means I'm fetching data first on the server, then I throw it all away and fetch everything again on the client, completely negating any benefits of running the loader on the server.
I've read some docs:...Server-side vs client-side validation
Which approach is better when working with Tanstack Start and Tanstack Form, is it server-side validation like the link bellow or client-side validation for authentication using Better Auth?
https://tanstack.com/form/latest/docs/framework/react/guides/ssr
In better auth docs, they recommend using auth client with Tanstack Start:
We recommend using the client SDK or authClient to handle authentication, rather than server actions with auth.api...
Vercel preset not deploying automatically
Can see that
vite build outputs .tanstack .nitro .vercel with target: "vercel" on the tanstack vite plugin. However when I deploy to vercel, with default output path in build settings, these don't seem to be getting picked up correctly and the old vercel 404 NOT FOUND white page of death shows up. Any ideas why? Should the build options output point to a particular one of those build dirs or is there something in the config I'm missing?Redirect question
I need to redirect a user to another page outside of my app from a server function and I'm using a redirect function passing the URL into the
href, but the thing is my app is hosted as an iframe and this does not work.
Basically I need something like the open function so I can pass in _top in the 2nd param like so:
open('https://...', '_top')
...Server Start or Init functions
I plan to deploy via docker on our own infra (aws) and I'd like to run some setup script which loads secrets from a vault before the server actually starts (in next.js I used the instrumentation.ts file) - what would be the equivalent or best practice for this in "Start"?
set the base url for serverFns?
can't find in the docs- is there a way to do this? i know they're not stable, but should be able to have a stable root domain right?
lambda.<mydomain> or something like this i'm deploying with the aws-lamda preset via sst, and it looks like my serverFn lambdas aren't picking up on the domain i've setCannot find module @rollup/rollup-win32-ia32-msvc with get started guide
Hey All, I would love some help, I'm trying to use the start templates and I've been going around in circles.
I'm on PC if that makes any difference but I've yet to actually get my vite server to start.
using ...
Showing pending state when loader data is reloading
I have a page with search parameters that fetches data based on the values of those search params.
Is there a way to show a pending state when those search params change and a updated
loader is happening behind the scenes so I can show the user that the UI is about to change?...Can't access a page element in an Outlet wrapper when it mounts when ssr: false
I have the following outlet wrapper component
Every page/route has a .element DOM element
I'd like to access it in this wrapper component
For a specific route, if I set ssr: true, the NodeList contains the element, if I set ssr: false, the NodeList is empty.
Is it expected ? Is there a way to make sure the Outlet has mounted to access the .element in the wrapper when ssr = false? Or I need to do a loop until the DOM element is present....
Error in renderToPipeableStream: TypeError: jsxDEV is not a function
Suddenly started this error in production server after build the app.
Any idea why it's happening.
Somehow the dev server works fine it's only happening in production build....
Only render component on the client?
Hi all, wondering what is the best way when you want to render React component only on client side in TanStack Start?
I'm trying something like
```
import { HelpCircle } from 'lucide-react';
...
Img onLoad not firing on initial page load when ssr: true
I render a simple image on a route:
```tsx
<img
src="/assets/images/villa/villa.webp"
height="200px"...
Does tanstack uses nodeJs runtime for everything server?
I couldn't find many mentions of runtime on the docs and I don't trust the chat gpt answers too much.
I just want to be sure before I migrate from nextJs to tanstack start. This edge runtime gave me so many headaches and we never used it as we host on bare metal and don't use serverless stuff....
Global middleware for JWT token refresh?
Is it possible to catch a 401 error in global middleware, call the refresh token logic, and then retry the original request?
I'm able to catch the error and refresh the token, but I'm not sure how to call the original request again.
My use case is that I use secure cookie storage with h3, so the client has no access to the JWT tokens....
How to access validator in createServerFileRoute?
We can create a server function and add a validator. But I want the validator in createServerFileRoute.
Receiving a file in a server function
Initially, I tried to use zod-form-data to be the validator:
...
.validator((data: unknown) => schema.parse(data))
.validator((data: unknown) => schema.parse(data))
Reading file in server function
The following code works in development but when I build the application the file being read is not found. The contents of the
src/data directory are not copied into the build. What's the correct way to read a file with a server function? And where should the file be placed?
```
import { createServerFn } from '@tanstack/react-start';
import { readFile } from 'node:fs/promises';...Differentiate between server and client on function level.
Using docker & developing outside docker.
Use-case:
- Imagine you are working with tanstack start and using dynamic server function in loader prop. And inside your server function, you want to fetch some data from the server running on docker.
...