Type error when following guide TRPC React query: 'lazy' is declared here.
Type 'CreateRouterInner<RootConfig<{ ctx: object; meta: object; errorShape: DefaultErrorShape; transformer: DefaultDataTransformer; }>, { users: CreateRouterInner<...>; }>' does not satisfy the constraint 'Router<any, any>'.
Types of property '_def' are incompatible.
Property 'lazy' is missing in type 'RouterDef<RootConfig<{ ctx: object; meta: object; errorShape: DefaultErrorShape; transformer: DefaultDataTransformer; }>, { users: CreateRouterInner<...>; }, { ...; }>' but required in type '{ _config: RootConfig<any>; router: true; procedure?: undefined; procedures: any; record: any; lazy: Record<string, LazyLoader<AnyRouter>>; }'.Type 'CreateRouterInner<RootConfig<{ ctx: object; meta: object; errorShape: DefaultErrorShape; transformer: DefaultDataTransformer; }>, { users: CreateRouterInner<...>; }>' does not satisfy the constraint 'Router<any, any>'.
Types of property '_def' are incompatible.
Property 'lazy' is missing in type 'RouterDef<RootConfig<{ ctx: object; meta: object; errorShape: DefaultErrorShape; transformer: DefaultDataTransformer; }>, { users: CreateRouterInner<...>; }, { ...; }>' but required in type '{ _config: RootConfig<any>; router: true; procedure?: undefined; procedures: any; record: any; lazy: Record<string, LazyLoader<AnyRouter>>; }'.https://trpc.io/docs/client/tanstack-react-query/setup#3a-setup-the-trpc-context-provider
I followed steps from guide to integrate react query tho it throws type error
import { initTRPC } from '@trpc/server';
import { z } from 'zod';
const t = initTRPC.create();
const publicProcedure = t.procedure;
const appRouter = t.router({
users: t.router({
getUserById: publicProcedure
.input(z.object({ userId: z.string() }))
.output(
z.object({
name: z.string(),
email: z.string(),
password: z.string(),
}),
)
.query(async () => 'PLACEHOLDER' as any),
}),
});
export type AppRouter = typeof appRouter;import { initTRPC } from '@trpc/server';
import { z } from 'zod';
const t = initTRPC.create();
const publicProcedure = t.procedure;
const appRouter = t.router({
users: t.router({
getUserById: publicProcedure
.input(z.object({ userId: z.string() }))
.output(
z.object({
name: z.string(),
email: z.string(),
password: z.string(),
}),
)
.query(async () => 'PLACEHOLDER' as any),
}),
});
export type AppRouter = typeof appRouter;import { createTRPCContext } from '@trpc/tanstack-react-query';
import { AppRouter } from '@server/@generated/server'
export const { TRPCProvider, useTRPC, useTRPCClient } = createTRPCContext<AppRouter>();import { createTRPCContext } from '@trpc/tanstack-react-query';
import { AppRouter } from '@server/@generated/server'
export const { TRPCProvider, useTRPC, useTRPCClient } = createTRPCContext<AppRouter>();
