Back to Trpc

Import Approuter

www/docs/partials/_import-approuter.mdx

11.16.01017 B
Original Source

Import your AppRouter type into the client application. This type holds the shape of your entire API.

twoslash
// @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;
ts
// @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. :::