T3 Stack: ReferenceError: Cannot access 'createCaller' before initialization

I want to use tRPC with mutations to upload a file in Next Js / T3 Stack with Supabase.
But no POST requests are working. The default 'post' mutation from the T3 stack template also does not work.


POST /api/trpc/files.uploadFile?batch=1 500 in 879ms
 ⨯ ReferenceError: Cannot access 'createCaller' before initialization
    at Module.createCaller (webpack-internal:///(rsc)/./src/server/api/root.ts:4:59)
    at eval (webpack-internal:///(rsc)/./src/trpc/server.ts:33:65)
    [...]) {
  type: 'ReferenceError',
  page: '/api/trpc/files.uploadFile'
}


TRPCClientError: Invalid response or stream interrupted
​​
cause: Error: Invalid response or stream interrupted
​​
columnNumber: 9
​​
data: undefinedfileName: "http://localhost:3000/_next/static/chunks/app/layout.js line 531 > eval"
​​
lineNumber: 54
​​
message: "Invalid response or stream interrupted"
​​
meta: undefined
​​
name: "TRPCClientError"
​​
shape: undefined
​​
stack: "TRPCClientError@webpack-internal:///(app-pages-browser)/./node_modules/@trpc/client/dist/TRPCClientError.mjs:54:9\nfrom@webpack-internal:///(app-pages-browser)/./node_modules/@trpc/client/dist/TRPCClientError.mjs:45:16\nunstable_httpBatchStreamLink/</</</<@webpack-internal:///(app-pag [...]

tRPC SHOULD config be correct, and should be able to run mutations, as I followed the installation guide. Because the default "post" also does not work, Supabase and the submission of FormData shouldn't be the problem.

What leads into the errors is the createCaller():

```
// src/trpc/server.ts

...
const caller = createCaller(createContext);

export const { trpc: api, HydrateClient } = createHydrationHelpers<AppRouter>(
caller,
getQueryClient,
);

// src/server/api/root.ts

...
export const createCaller = createCallerFactory(appRouter);
Was this page helpful?