tRPC Vue-Query

Fully type-safe composables and helpers to make working with tRPC + Tanstack Query as intuitive as possible.

<script lang="ts" setup>
  const trpc = useTRPC()

  const { data: cart } = trpc.cart.get.useQuery()

  const { mutate: addToCart } = trpc.cart.addItem.useMutation({
    onSuccess() {
      trpc.cart.get.invalidate()
    }
  })
</script>

Nuxt 3 or Vue 3

Compatible with both trpc-nuxt module and Vue 3.

TypeScript

The fully typed development experience tRPC is known and loved for.

Helper Composables

Full set helpers for common Tanstack Query operations.