ReferenceError: Cannot access '__vite_ssr_import_2__' before initialization #5673
Description
Which project does this relate to?
Start
Describe the bug
When starting our tanstack start application in development environment, we sometimes get the following error in the terminal:
ReferenceError: Cannot access '__vite_ssr_import_2__' before initialization
at Module.getRouter (/Users/ulrichstark/Desktop/tanstack-vite-cannot-access-vite-ssr-import-before-initalization/src/router.tsx:7:9)
... 2 lines matching cause stack trace ...
at async eval (/Users/ulrichstark/Desktop/tanstack-vite-cannot-access-vite-ssr-import-before-initalization/node_modules/@tanstack/start-server-core/src/createStartHandler.ts:243:32) {
cause: ReferenceError: Cannot access '__vite_ssr_import_2__' before initialization
at Module.getRouter (/Users/ulrichstark/Desktop/tanstack-vite-cannot-access-vite-ssr-import-before-initalization/src/router.tsx:7:9)
at getRouter (/Users/ulrichstark/Desktop/tanstack-vite-cannot-access-vite-ssr-import-before-initalization/node_modules/@tanstack/start-server-core/src/createStartHandler.ts:123:55)
at async handleServerRoutes (/Users/ulrichstark/Desktop/tanstack-vite-cannot-access-vite-ssr-import-before-initalization/node_modules/@tanstack/start-server-core/src/createStartHandler.ts:358:18)
at async eval (/Users/ulrichstark/Desktop/tanstack-vite-cannot-access-vite-ssr-import-before-initalization/node_modules/@tanstack/start-server-core/src/createStartHandler.ts:243:32),
status: 500,
statusText: undefined,
headers: undefined,
data: undefined,
body: undefined,
unhandled: true
}
And the opened application in the browser only shows:
{"status":500,"unhandled":true,"message":"HTTPError"}When reloading the page, the error goes away and our application is shown.
Your Example Website or App
https://github.com/ulrichstark/tanstack-vite-cannot-access-vite-ssr-import-before-initalization
Steps to Reproduce the Bug or Issue
- Clone
https://github.com/ulrichstark/tanstack-vite-cannot-access-vite-ssr-import-before-initalization - Go into folder
npm install- Run
npx vite --force - Wait a few seconds
- If error isn't visible, stop vite and try again starting from step 4
Expected behavior
No error
Screenshots or Videos
No response
Platform
- Router / Start Version: 1.133.34
- OS: macOS
- Browser: Chrome
- Browser Version: 141.0.7390.123
- Bundler: Vite
- Bundler Version: 7.1.12
Additional context
Don't mind the funky reproduction project. It's a product of hours deleting stuff in our project to condense it down to the minimal amount of code that triggers this issue. I hope you can reproduce it on your side. I'm not sure what is causing the issue because it seems to be gone when I delete more relevant code from the project. It's most probably something with my ErrorComponent and its server function which is used as defaultErrorComponent:
import { createServerFn } from "@tanstack/react-start";
import { useEffect } from "react";
import { getCookies } from "@tanstack/react-start/server";
import { House } from "lucide-react";
const reportErrorToServer = createServerFn().handler(() => {
getCookies();
});
export function ErrorComponent() {
useEffect(() => {
reportErrorToServer();
}, []);
return <House />;
}