reactStartCookies plugin make tanstack build fails

Hello 👋 I'm trying to use better-auth with tanstack start but with a separate backend (a nestjs api). Following the documentation and using the plugin for cookies:
import { reactStartCookies } from "better-auth/react-start";
import { reactStartCookies } from "better-auth/react-start";
this makes the build (with vite) fails with the following message:
✗ Build failed in 964ms
error during build:
node_modules/@tanstack/router-core/dist/esm/ssr/transformStreamWithRouter.js (2:9): "Readable" is not exported by "__vite-browser-external", imported by "node_modules/@tanstack/router-core/dist/esm/ssr/transformStreamWithRouter.js".
file: /Users/nicolas/Documents/Projects/start-basic/node_modules/@tanstack/router-core/dist/esm/ssr/transformStreamWithRouter.js:2:9

1: import { ReadableStream } from "node:stream/web";
2: import { Readable } from "node:stream";
^
3: import { createControlledPromise } from "../utils.js";
4: function transformReadableStreamWithRouter(router, routerStream) {
✗ Build failed in 964ms
error during build:
node_modules/@tanstack/router-core/dist/esm/ssr/transformStreamWithRouter.js (2:9): "Readable" is not exported by "__vite-browser-external", imported by "node_modules/@tanstack/router-core/dist/esm/ssr/transformStreamWithRouter.js".
file: /Users/nicolas/Documents/Projects/start-basic/node_modules/@tanstack/router-core/dist/esm/ssr/transformStreamWithRouter.js:2:9

1: import { ReadableStream } from "node:stream/web";
2: import { Readable } from "node:stream";
^
3: import { createControlledPromise } from "../utils.js";
4: function transformReadableStreamWithRouter(router, routerStream) {
After digging the code of the plugin, it seems that vite fails to correctly split the client and server bundles, because the plugin is using server side functions (like getCookie) that are only available on the server (not the client). I have create a minimal repository here : https://github.com/Oupsla/tanstack-better-auth-build-bug You can check that the build is failing, and just removing the plugin makes the build passing. Is anyone succeed to use tanstack plugin with a separate backend ? Thank you !
GitHub
GitHub - Oupsla/tanstack-better-auth-build-bug
Contribute to Oupsla/tanstack-better-auth-build-bug development by creating an account on GitHub.
7 Replies
SHAH
SHAH7d ago
@Oupsla did you figure this out?
̾̒̊҉̱̹͙ ͧͬͤ
I thought i was the only one who had this issue i am using just tanstack start but have encountered a similar error with vite being unable to split between server and client
rchrds
rchrds2d ago
Ops error is because they are using reactStartCookies on the authClient, it's meant to be used server-side with auth , see here
TanStack Start Integration | Better Auth
Integrate Better Auth with TanStack Start.
̾̒̊҉̱̹͙ ͧͬͤ
ive been talking with some people in the tanstack server and i think this is a more general issue from a new release not betterauth's fault
rchrds
rchrds2d ago
the steps are slightly different in RC
rchrds
rchrds2d ago
this looks okay re better-auth stuff https://github.com/dotnize/react-tanstarter
GitHub
GitHub - dotnize/react-tanstarter: 🏝️ minimal TanStack Start t...
🏝️ minimal TanStack Start template with Better Auth, Drizzle ORM, shadcn/ui - dotnize/react-tanstarter
rchrds
rchrds2d ago
the $.tsx syntax has changed and you shouldn't need a src/server.ts file, this is assuming you've updated the non better auth stuff

Did you find this page helpful?