www/docs/partials/_import-approuter.mdx
Import your AppRouter type into the client application. This type holds the shape of your entire API.
// @filename: server/router.ts
// ---cut---
import { initTRPC } from '@trpc/server';
import { z } from "zod";
const t = initTRPC.create();
const appRouter = t.router({
post: t.router({
byId: t.procedure
.input(z.object({ id: z.string() }))
.query(async ({input}) => {
return { id: input.id, title: 'Hello' };
}),
})
});
export type AppRouter = typeof appRouter;
// @include: router
// @filename: utils/trpc.ts
// ---cut---
import type { AppRouter } from '../server/router';
:::tip
By using import type you ensure that the reference will be stripped at compile-time, meaning you don't inadvertently import server-side code into your client. For more information, see the Typescript docs.
:::