@orpc/vue-query

1.1.1 • Public • Published
oRPC logo

Typesafe APIs Made Simple 🪄

oRPC is a powerful combination of RPC and OpenAPI, makes it easy to build APIs that are end-to-end type-safe and adhere to OpenAPI standards


Highlights

  • 🔗 End-to-End Type Safety: Ensure type-safe inputs, outputs, and errors from client to server.
  • 📘 First-Class OpenAPI: Built-in support that fully adheres to the OpenAPI standard.
  • 📝 Contract-First Development: Optionally define your API contract before implementation.
  • ⚙️ Framework Integrations: Seamlessly integrate with TanStack Query (React, Vue, Solid, Svelte), Pinia Colada, and more.
  • 🚀 Server Actions: Fully compatible with React Server Actions on Next.js, TanStack Start, and other platforms.
  • 🔠 Standard Schema Support: Works out of the box with Zod, Valibot, ArkType, and other schema validators.
  • 🗃️ Native Types: Supports native types like Date, File, Blob, BigInt, URL, and more.
  • ⏱️ Lazy Router: Enhance cold start times with our lazy routing feature.
  • 📡 SSE & Streaming: Enjoy full type-safe support for SSE and streaming.
  • 🌍 Multi-Runtime Support: Fast and lightweight on Cloudflare, Deno, Bun, Node.js, and beyond.
  • 🔌 Extendability: Easily extend functionality with plugins, middleware, and interceptors.
  • 🛡️ Reliability: Well-tested, TypeScript-based, production-ready, and MIT licensed.

Documentation

You can find the full documentation here.

Packages

@orpc/vue-query

Integration with Vue Query. Read the documentation for more information.

export function Setup() {
  const query = useQuery(orpc.planet.find.queryOptions({
    input: { id: 123 }, // Specify input if needed
    context: { cache: true }, // Provide client context if needed
  // additional options...
  }))

  const query = useInfiniteQuery(orpc.planet.list.infiniteOptions({
    input: (pageParam: number | undefined) => ({ limit: 10, offset: pageParam }),
    context: { cache: true }, // Provide client context if needed
    initialPageParam: undefined,
    getNextPageParam: lastPage => lastPage.nextPageParam,
  // additional options...
  }))

  const mutation = useMutation(orpc.planet.create.mutationOptions({
    context: { cache: true }, // Provide client context if needed
  // additional options...
  }))

  mutation.mutate({ name: 'Earth' })

  const queryClient = useQueryClient()

  // Invalidate all planet queries
  queryClient.invalidateQueries({
    queryKey: orpc.planet.key(),
  })

  // Invalidate only regular (non-infinite) planet queries
  queryClient.invalidateQueries({
    queryKey: orpc.planet.key({ type: 'query' })
  })

  // Invalidate the planet find query with id 123
  queryClient.invalidateQueries({
    queryKey: orpc.planet.find.key({ input: { id: 123 } })
  })
}

Sponsors

License

Distributed under the MIT License. See LICENSE for more information.

Package Sidebar

Install

npm i @orpc/vue-query

Weekly Downloads

987

Version

1.1.1

License

MIT

Unpacked Size

25.6 kB

Total Files

6

Last publish

Collaborators

  • unnoq