Installation
1. Add to existing Nuxt project
pnpm
pnpm 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 }}
If strict mode is too much, at least enable strictNullChecks
:
tsconfig.json
{ "extends": "./.nuxt/tsconfig.json", "compilerOptions": { "strictNullChecks": true }}
Next Steps
Now that you've installed the required dependencies, you are ready to start building your application.