Installation

1. Add to existing Nuxt project

pnpm
pnpm add @trpc/server@next @trpc/client@next trpc-nuxt@beta zod
npm
npm install @trpc/server@next @trpc/client@next trpc-nuxt@beta zod
yarn
yarn add @trpc/server@next @trpc/client@next trpc-nuxt@beta zod

Why @trpc/server?

For implementing tRPC endpoints and routers.

Why @trpc/client?

For making typesafe API calls from your client.

Why zod?

Most examples use Zod for input validation and tRPC.io highly recommends it, though it isn't required.

2. Install module

This will transpile trpc-nuxt and exclude trpc-nuxt/client from optimized dependencies by Vite.

nuxt.config.ts
export default defineNuxtConfig({  modules: ['trpc-nuxt/module']})

3. Enable strict mode

If you want to use Zod for input validation, make sure you have enabled strict mode:

tsconfig.json
{  "extends": "./.nuxt/tsconfig.json",  "compilerOptions": {    "strict": true  }}
nuxt.config.ts
export default defineNuxtConfig({  typescript: {    strict: true  }})

If strict mode is too much, at least enable strictNullChecks:

tsconfig.json
{  "extends": "./.nuxt/tsconfig.json",  "compilerOptions": {    "strictNullChecks": true  }}
nuxt.config.ts
export default defineNuxtConfig({  typescript: {    tsConfig: {      strictNullChecks: true    }  }})

Next Steps

Now that you've installed the required dependencies, you are ready to start building your application.