T
tRPC

❓-help

`The property 'query' in your router collides with a built-in method`

Mmh1512/4/2023
I'm seeing an error (attached) where I can get autocompletes on TRPC in the file where the client is defined, but not anywhere I import it in.
// client.ts
import { createTRPCProxyClient, httpBatchLink } from "@trpc/client";

import type { AppRouter } from "wherever";

export const trpcClient = createTRPCProxyClient<AppRouter>({
links: [
httpBatchLink({
url: `whatever`,
// You can pass any HTTP headers you wish here
async headers() {
return {
authorization: "whatever",
};
},
}),
],
});
// client.ts
import { createTRPCProxyClient, httpBatchLink } from "@trpc/client";

import type { AppRouter } from "wherever";

export const trpcClient = createTRPCProxyClient<AppRouter>({
links: [
httpBatchLink({
url: `whatever`,
// You can pass any HTTP headers you wish here
async headers() {
return {
authorization: "whatever",
};
},
}),
],
});
It does call the backend but the type checking isn't working.
Solution:
I was reexporting my type signatures in a barrel file. Importing directly fixed the issue.
Jump to solution
No description
Mmh1512/4/2023
Also, my google-fu is failing me for this type error. Github repo doesn't seem to contain the source either.
Nnlucas12/4/2023
What does your router look like?
Mmh1512/4/2023
index.ts on the left and trpc.ts on the right
Mmh1512/4/2023
No description
Solution
Mmh1512/4/2023
I was reexporting my type signatures in a barrel file. Importing directly fixed the issue.
Nnlucas12/4/2023
Hm that’s interesting, maybe a tsconfig related thing?
Mmh1512/4/2023
Yeah probably. I’m integrating trpc into an existing monorepo so have all kinds of mess going on with the paths
SScythern1/17/2024
To clarify this if anyone is looking in the future, I have the following server/src/utils/trpc.ts:
import { initTRPC } from "@trpc/server";
export const t = initTRPC.create()`
import { initTRPC } from "@trpc/server";
export const t = initTRPC.create()`
And in server/src/app.ts...
import { t } from "~/utils/trpc" // this causes the error
import { t } from "./utils/trpc" // this has resolved it
import { t } from "~/utils/trpc" // this causes the error
import { t } from "./utils/trpc" // this has resolved it
My tsconfig looks like this:
// ...
"paths": {
"~/*": ["./src/*"]
}
// ...
"paths": {
"~/*": ["./src/*"]
}
Does seem to be tsconfig themed for sure. I have a pretty basic set up, no craziness happening with paths besides what I sent above.

Looking for more? Join the community!

Recommended Posts
Using trpc backend across multiple seperate front endsI want to create a nodejs backend with trpc to expose some api endpoints. This will then be called aHow can I Prefetch on client or server component on App router Nextjs?how can I pretch data on app router nextjsPage couldn't be rendered statically because it used `cookies`Has anyone had this issue? I'm using trpc in a server component and in localhost it works fine but iComparing tRPC and Server Actions for a SaaS Template: Seeking Insights and AdviceHey everyone 👋, I've just posted a detailed comparison and discussion request on Reddit about tRPCsetting up trpc in next 14Pleaase I need help on how to integrate trpc in next js 14, please help mecreateTRPCReact transformers getting type errorHave anyone tried migration from TRPC router to app router apiI was learning the trpc and I wanna know to go back and forth with trpc and restapi. can anyone knowHas anyone integrated trpc + udp (quic/webtransport api)?Hi all, I'm thinking about taking advantage of quic for a certain part of my project. Basically I'm onSuccess invalidateI'm trying to follow along with Theo's T3 tutorial using the latest Next version and the app routerReact Query client and caller client under one objectWould love to know if it is possible to have caller and react query clients under one object? I feeI want to refetch and set the inital data of an useStateHello guys, currently i am retrieving the data i use in useState with `SSR`, but i want to use someVanilla Client Error HandlingWhat is the right way to handle errors when using the vanilla client? If I setup a client like so: sidebar searchPlease how will I implement a search on the left sidebar to let the items on the search bar be searcWS with TRPC```ts │  Type '({ req, res, }: { req: Request; res: Response; }) => CreateInnerContextOpts' is tRPC is butchering object types in return typesSo if I have a mutation that returns this type ```ts { name?: string } ``` the type that tRPC infersWhy my Authorization does not update ?i have this in `_app.tsx` ```export default function App({ Component, pageProps }: AppProps) { retTypeError: queryClient.getMutationDefaults is not a function (it is undefined)Hi! There's not much code to show here, as I'm really not sure where the error actually occurs. InuseQuery never returning or hitting APII have something off in my configuration, i copied most of the files from the `❯ npm create t3-app@lType 'QueryClient' is missing the following properties from type 'QueryClient': queryCache, mutationI am trying to setup a new project and doing my first client side query and getting this error: ```trpc mutation call stuckI have an issue with a simple mutation procedure: `getPublicUser: publicProcedure .input(z.obje