diff --git a/packages/vue-query/src/types.ts b/packages/vue-query/src/types.ts
index eb964bbb..adc4477d 100644
--- a/packages/vue-query/src/types.ts
+++ b/packages/vue-query/src/types.ts
@@ -16,8 +16,9 @@ export type NonUndefinedGuard<T> = T extends undefined ? never : T
 
 export type InferCursor<T> = T extends { cursor?: any } ? T['cursor'] : never
 
-export type QueryOptions<TInput, TOutput, TSelectData> =
+export type QueryOptions<TInput, TOutput, TClientContext, TSelectData> =
   & (undefined extends TInput ? { input?: MaybeDeepRef<TInput> } : { input: MaybeDeepRef<TInput> })
+  & (undefined extends TClientContext ? { context?: MaybeDeepRef<TClientContext> } : { context: MaybeDeepRef<TClientContext> })
   & SetOptional<{
     [P in keyof QueryObserverOptions<TOutput, DefaultError, TSelectData, TOutput, QueryKey>]: P extends 'enabled'
       ? MaybeRefOrGetter<QueryObserverOptions<TOutput, DefaultError, TSelectData, TOutput, QueryKey>[P]>
@@ -28,14 +29,16 @@ export type QueryOptions<TInput, TOutput, TSelectData> =
     initialData?: NonUndefinedGuard<TOutput> | (() => NonUndefinedGuard<TOutput>) | undefined
   }
 
-export type InfiniteOptions<TInput, TOutput, TSelectData> =
+export type InfiniteOptions<TInput, TOutput, TClientContext, TSelectData> =
   & (undefined extends TInput ? { input?: MaybeDeepRef<Omit<TInput, 'cursor'>> } : { input: MaybeDeepRef<Omit<TInput, 'cursor'>> })
+  & (undefined extends TClientContext ? { context?: MaybeDeepRef<TClientContext> } : { context: MaybeDeepRef<TClientContext> })
   & SetOptional<
     UseInfiniteQueryOptions<TOutput, DefaultError, TSelectData, TOutput, QueryKey, InferCursor<TInput>>,
     'queryKey' | (undefined extends InferCursor<TInput> ? 'initialPageParam' : never)
   >
 
-export type MutationOptions<TInput, TOutput> =
+export type MutationOptions<TInput, TOutput, TClientContext> =
+  & (undefined extends TClientContext ? { context?: MaybeDeepRef<TClientContext> } : { context: MaybeDeepRef<TClientContext> })
   & {
     [P in keyof MutationObserverOptions<TOutput, DefaultError, TInput, unknown>]: MaybeDeepRef<MutationObserverOptions<TOutput, DefaultError, TInput, unknown>[P]>
   }
diff --git a/packages/vue-query/src/utils-procedure.test-d.ts b/packages/vue-query/src/utils-procedure.test-d.ts
index 7e84f549..aedfdceb 100644
--- a/packages/vue-query/src/utils-procedure.test-d.ts
+++ b/packages/vue-query/src/utils-procedure.test-d.ts
@@ -1,16 +1,17 @@
 import type { ProcedureClient } from '@orpc/server'
 import type { InfiniteData, QueryKey } from '@tanstack/vue-query'
-import { useInfiniteQuery, useQuery } from '@tanstack/vue-query'
+import type { ProcedureUtils } from './utils-procedure'
+import { useInfiniteQuery, useMutation, useQuery } from '@tanstack/vue-query'
 import { ref } from 'vue'
 import { createProcedureUtils } from './utils-procedure'
 
 describe('queryOptions', () => {
-  const client = vi.fn <ProcedureClient<number | undefined, string | undefined>>(
+  const client = vi.fn <ProcedureClient<number | undefined, string | undefined, undefined>>(
     (...[input]) => Promise.resolve(input?.toString()),
   )
   const utils = createProcedureUtils(client, [])
 
-  const client2 = vi.fn((input: number) => Promise.resolve(input.toString()))
+  const client2 = {} as ProcedureClient<number, string, undefined>
   const utils2 = createProcedureUtils(client2, [])
 
   it('infer correct input type', () => {
@@ -52,13 +53,42 @@ describe('queryOptions', () => {
 
     expectTypeOf(query.data.value).toEqualTypeOf<{ value: number } | undefined>()
   })
+
+  describe('client context', () => {
+    it('can be optional', () => {
+      const utils = {} as ProcedureUtils<undefined, string, undefined | { batch?: boolean }>
+      useQuery(utils.queryOptions())
+      useQuery(utils.queryOptions({}))
+      useQuery(utils.queryOptions({ context: undefined }))
+      useQuery(utils.queryOptions({ context: { batch: true } }))
+      useQuery(utils.queryOptions({ context: { batch: ref(true) } }))
+      // @ts-expect-error --- invalid context
+      useQuery(utils.queryOptions({ context: { batch: 'invalid' } }))
+      // @ts-expect-error --- invalid context
+      useQuery(utils.queryOptions({ context: { batch: ref('invalid') } }))
+    })
+
+    it('required pass context when non-optional', () => {
+      const utils = {} as ProcedureUtils<undefined, string, { batch?: boolean }>
+      // @ts-expect-error --- missing context
+      useQuery(utils.queryOptions())
+      // @ts-expect-error --- missing context
+      useQuery(utils.queryOptions({}))
+      useQuery(utils.queryOptions({ context: { batch: true } }))
+      useQuery(utils.queryOptions({ context: { batch: ref(false) } }))
+      // @ts-expect-error --- invalid context
+      useQuery(utils.queryOptions({ context: { batch: 'invalid' } }))
+      // @ts-expect-error --- invalid context
+      useQuery(utils.queryOptions({ context: { batch: ref('invalid') } }))
+    })
+  })
 })
 
 describe('infiniteOptions', () => {
   const getNextPageParam = vi.fn()
 
   it('cannot use on procedure without input object-able', () => {
-    const utils = createProcedureUtils({} as (input: number) => Promise<string>, [])
+    const utils = createProcedureUtils({} as ProcedureClient<number, string, undefined>, [])
 
     // @ts-expect-error missing initialPageParam
     utils.infiniteOptions({
@@ -81,7 +111,7 @@ describe('infiniteOptions', () => {
   })
 
   it('infer correct input type', () => {
-    const utils = createProcedureUtils({} as (input: { limit?: number, cursor: number }) => Promise<string>, [])
+    const utils = createProcedureUtils({} as ProcedureClient<{ limit?: number, cursor: number }, string, undefined>, [])
 
     utils.infiniteOptions({
       input: {
@@ -126,7 +156,7 @@ describe('infiniteOptions', () => {
   })
 
   it('infer correct initialPageParam type', () => {
-    const utils = createProcedureUtils({} as (input: { limit?: number, cursor: number }) => Promise<string>, [])
+    const utils = createProcedureUtils({} as ProcedureClient<{ limit?: number, cursor: number }, string, undefined>, [])
 
     utils.infiniteOptions({
       input: {},
@@ -162,14 +192,14 @@ describe('infiniteOptions', () => {
   })
 
   it('initialPageParam can be optional', () => {
-    const utils = createProcedureUtils({} as (input: { limit?: number, cursor?: number }) => Promise<string>, [])
+    const utils = createProcedureUtils({} as ProcedureClient<{ limit?: number, cursor?: number }, string, undefined>, [])
 
     utils.infiniteOptions({
       input: {},
       getNextPageParam,
     })
 
-    const utils2 = createProcedureUtils({} as (input: { limit?: number, cursor: number }) => Promise<string>, [])
+    const utils2 = createProcedureUtils({} as ProcedureClient<{ limit?: number, cursor: number }, string, undefined>, [])
 
     // @ts-expect-error initialPageParam is required
     utils2.infiniteOptions({
@@ -179,13 +209,13 @@ describe('infiniteOptions', () => {
   })
 
   it('input can be optional', () => {
-    const utils = createProcedureUtils({} as ProcedureClient<{ limit?: number, cursor?: number } | undefined, string>, [])
+    const utils = createProcedureUtils({} as ProcedureClient<{ limit?: number, cursor?: number } | undefined, string, undefined>, [])
 
     utils.infiniteOptions({
       getNextPageParam,
     })
 
-    const utils2 = createProcedureUtils({} as (input: { limit?: number, cursor?: number }) => Promise<string>, [])
+    const utils2 = createProcedureUtils({} as ProcedureClient<{ limit?: number, cursor?: number }, string, undefined>, [])
 
     // @ts-expect-error input is required
     utils2.infiniteOptions({
@@ -194,7 +224,7 @@ describe('infiniteOptions', () => {
   })
 
   it('infer correct output type', () => {
-    const utils = createProcedureUtils({} as (input: { limit?: number, cursor: number }) => Promise<string>, [])
+    const utils = createProcedureUtils({} as ProcedureClient<{ limit?: number, cursor: number }, string, undefined>, [])
     const query = useInfiniteQuery(utils.infiniteOptions({
       input: {
         limit: 1,
@@ -207,7 +237,7 @@ describe('infiniteOptions', () => {
   })
 
   it('work with select options', () => {
-    const utils = createProcedureUtils({} as (input: { limit?: number, cursor: number }) => Promise<string>, [])
+    const utils = createProcedureUtils({} as ProcedureClient<{ limit?: number, cursor: number }, string, undefined>, [])
     const query = useInfiniteQuery(utils.infiniteOptions({
       input: {
         limit: ref(1),
@@ -223,10 +253,44 @@ describe('infiniteOptions', () => {
 
     expectTypeOf(query.data.value).toEqualTypeOf<{ value: number } | undefined>()
   })
+
+  describe('client context', () => {
+    it('can be optional', () => {
+      const utils = {} as ProcedureUtils<undefined | { limit?: number, cursor: number }, string, undefined | { batch?: boolean }>
+
+      const getNextPageParam = vi.fn()
+      const initialPageParam = 1
+
+      useInfiniteQuery(utils.infiniteOptions({ getNextPageParam, initialPageParam }))
+      useInfiniteQuery(utils.infiniteOptions({ getNextPageParam, initialPageParam, context: undefined }))
+      useInfiniteQuery(utils.infiniteOptions({ getNextPageParam, initialPageParam, context: { batch: true } }))
+      useInfiniteQuery(utils.infiniteOptions({ getNextPageParam, initialPageParam, context: { batch: ref(false) } }))
+      // @ts-expect-error --- invalid context
+      useInfiniteQuery(utils.infiniteOptions({ getNextPageParam, initialPageParam, context: { batch: 'invalid' } }))
+      // @ts-expect-error --- invalid context
+      useInfiniteQuery(utils.infiniteOptions({ getNextPageParam, initialPageParam, context: { batch: ref('invalid') } }))
+    })
+
+    it('required pass context when non-optional', () => {
+      const utils = {} as ProcedureUtils<undefined | { limit?: number, cursor: number }, string, { batch?: boolean }>
+
+      const getNextPageParam = vi.fn()
+      const initialPageParam = 1
+
+      // @ts-expect-error --- missing context
+      useInfiniteQuery(utils.infiniteOptions({ getNextPageParam, initialPageParam }))
+      useInfiniteQuery(utils.infiniteOptions({ getNextPageParam, initialPageParam, context: { batch: true } }))
+      useInfiniteQuery(utils.infiniteOptions({ getNextPageParam, initialPageParam, context: { batch: ref(false) } }))
+      // @ts-expect-error --- invalid context
+      useInfiniteQuery(utils.infiniteOptions({ getNextPageParam, initialPageParam, context: { batch: 'invalid' } }))
+      // @ts-expect-error --- invalid context
+      useInfiniteQuery(utils.infiniteOptions({ getNextPageParam, initialPageParam, context: { batch: ref('invalid') } }))
+    })
+  })
 })
 
 describe('mutationOptions', () => {
-  const client = vi.fn((input: number) => Promise.resolve(input.toString()))
+  const client = {} as ProcedureClient<number, string, undefined>
   const utils = createProcedureUtils(client, [])
 
   it('infer correct input type', () => {
@@ -261,4 +325,33 @@ describe('mutationOptions', () => {
     expectTypeOf(option.mutationKey).toEqualTypeOf<QueryKey>()
     expectTypeOf(option.mutationFn).toMatchTypeOf<(input: number) => Promise<string>>()
   })
+
+  describe('client context', () => {
+    it('can be optional', () => {
+      const utils = {} as ProcedureUtils<undefined, string, undefined | { batch?: boolean }>
+      useMutation(utils.mutationOptions())
+      useMutation(utils.mutationOptions({}))
+      useMutation(utils.mutationOptions({ context: undefined }))
+      useMutation(utils.mutationOptions({ context: { batch: true } }))
+      useMutation(utils.mutationOptions({ context: { batch: ref(false) } }))
+      // @ts-expect-error --- invalid context
+      useMutation(utils.mutationOptions({ context: { batch: 'invalid' } }))
+      // @ts-expect-error --- invalid context
+      useMutation(utils.mutationOptions({ context: { batch: ref('invalid') } }))
+    })
+
+    it('required pass context when non-optional', () => {
+      const utils = {} as ProcedureUtils<undefined, string, { batch?: boolean }>
+      // @ts-expect-error --- missing context
+      useMutation(utils.mutationOptions())
+      // @ts-expect-error --- missing context
+      useMutation(utils.mutationOptions({}))
+      useMutation(utils.mutationOptions({ context: { batch: true } }))
+      useMutation(utils.mutationOptions({ context: { batch: ref(false) } }))
+      // @ts-expect-error --- invalid context
+      useMutation(utils.mutationOptions({ context: { batch: 123 } }))
+      // @ts-expect-error --- invalid context
+      useMutation(utils.mutationOptions({ context: { batch: ref(123) } }))
+    })
+  })
 })
diff --git a/packages/vue-query/src/utils-procedure.test.ts b/packages/vue-query/src/utils-procedure.test.ts
index f316a229..534c1791 100644
--- a/packages/vue-query/src/utils-procedure.test.ts
+++ b/packages/vue-query/src/utils-procedure.test.ts
@@ -1,4 +1,3 @@
-import type { ProcedureClient } from '@orpc/server'
 import { ref } from 'vue'
 import * as keyModule from './key'
 import { createProcedureUtils } from './utils-procedure'
@@ -13,7 +12,7 @@ beforeEach(() => {
 })
 
 describe('queryOptions', () => {
-  const client = vi.fn<ProcedureClient<number | undefined, string | undefined>>(
+  const client = vi.fn(
     (...[input]) => Promise.resolve(input?.toString()),
   )
   const utils = createProcedureUtils(client, ['ping'])
@@ -48,13 +47,29 @@ describe('queryOptions', () => {
     expect(client).toHaveBeenCalledTimes(1)
     expect(client).toBeCalledWith(1, { signal })
   })
+
+  it('works with client context', async () => {
+    const client = vi.fn((...[input]) => Promise.resolve(input?.toString()))
+    const utils = createProcedureUtils(client, ['ping'])
+
+    const options = utils.queryOptions({ context: { batch: ref(true) } })
+
+    expect(options.queryKey.value).toEqual(['__ORPC__', ['ping'], { type: 'query' }])
+    expect(buildKeySpy).toHaveBeenCalledTimes(1)
+    expect(buildKeySpy).toHaveBeenCalledWith(['ping'], { type: 'query' })
+
+    client.mockResolvedValueOnce('__mocked__')
+    await expect((options as any).queryFn({ signal })).resolves.toEqual('__mocked__')
+    expect(client).toHaveBeenCalledTimes(1)
+    expect(client).toBeCalledWith(undefined, { signal, context: { batch: true } })
+  })
 })
 
 describe('infiniteOptions', () => {
   const getNextPageParam = vi.fn()
 
   it('works ', async () => {
-    const client = vi.fn<(input: { limit?: number, cursor: number | undefined }) => Promise<string>>()
+    const client = vi.fn()
     const utils = createProcedureUtils(client, [])
 
     const options = utils.infiniteOptions({
@@ -75,7 +90,7 @@ describe('infiniteOptions', () => {
   })
 
   it('works without initialPageParam', async () => {
-    const client = vi.fn<(input: { limit?: number, cursor: number | undefined }) => Promise<string>>()
+    const client = vi.fn()
     const utils = createProcedureUtils(client, [])
 
     const options = utils.infiniteOptions({
@@ -94,7 +109,7 @@ describe('infiniteOptions', () => {
   })
 
   it('works with ref', async () => {
-    const client = vi.fn<(input: { limit?: number, cursor: number | undefined }) => Promise<string>>()
+    const client = vi.fn()
     const utils = createProcedureUtils(client, [])
 
     const input = ref({ limit: ref(5) })
@@ -114,10 +129,30 @@ describe('infiniteOptions', () => {
     expect(client).toHaveBeenCalledTimes(1)
     expect(client).toBeCalledWith({ limit: 5, cursor: 1 }, { signal })
   })
+
+  it('works with client context', async () => {
+    const client = vi.fn()
+    const utils = createProcedureUtils(client, [])
+
+    const options = utils.infiniteOptions({
+      context: { batch: ref(true) },
+      getNextPageParam,
+      initialPageParam: 1,
+    })
+
+    expect(options.queryKey.value).toEqual(['__ORPC__', [], { type: 'infinite' }])
+    expect(buildKeySpy).toHaveBeenCalledTimes(1)
+    expect(buildKeySpy).toHaveBeenCalledWith([], { type: 'infinite' })
+
+    client.mockResolvedValueOnce('__mocked__')
+    await expect((options as any).queryFn({ pageParam: 1, signal })).resolves.toEqual('__mocked__')
+    expect(client).toHaveBeenCalledTimes(1)
+    expect(client).toBeCalledWith({ limit: undefined, cursor: 1 }, { signal, context: { batch: true } })
+  })
 })
 
 describe('mutationOptions', () => {
-  const client = vi.fn<ProcedureClient<number | undefined, string | undefined>>(
+  const client = vi.fn(
     (...[input]) => Promise.resolve(input?.toString()),
   )
   const utils = createProcedureUtils(client, ['ping'])
@@ -138,4 +173,22 @@ describe('mutationOptions', () => {
     expect(client).toHaveBeenCalledTimes(1)
     expect(client).toBeCalledWith(1)
   })
+
+  it('works with client context', async () => {
+    const client = vi.fn(
+      (...[input]) => Promise.resolve(input?.toString()),
+    )
+    const utils = createProcedureUtils(client, ['ping'])
+
+    const options = utils.mutationOptions({ context: { batch: ref(true) } })
+
+    expect(options.mutationKey).toEqual(['__ORPC__', ['ping'], { type: 'mutation' }])
+    expect(buildKeySpy).toHaveBeenCalledTimes(1)
+    expect(buildKeySpy).toHaveBeenCalledWith(['ping'], { type: 'mutation' })
+
+    client.mockResolvedValueOnce('__mocked__')
+    await expect(options.mutationFn(1)).resolves.toEqual('__mocked__')
+    expect(client).toHaveBeenCalledTimes(1)
+    expect(client).toBeCalledWith(1, { context: { batch: true } })
+  })
 })
diff --git a/packages/vue-query/src/utils-procedure.ts b/packages/vue-query/src/utils-procedure.ts
index 381c951f..63b1c032 100644
--- a/packages/vue-query/src/utils-procedure.ts
+++ b/packages/vue-query/src/utils-procedure.ts
@@ -10,35 +10,35 @@ import { deepUnref } from './utils'
 /**
  * Utils at procedure level
  */
-export interface ProcedureUtils<TInput, TOutput> {
-  queryOptions: <U extends QueryOptions<TInput, TOutput, any>>(
-    ...options: [U] | (undefined extends TInput ? [] : never)
-  ) => IsEqual<U, QueryOptions<TInput, TOutput, any>> extends true
+export interface ProcedureUtils<TInput, TOutput, TClientContext> {
+  queryOptions: <U extends QueryOptions<TInput, TOutput, TClientContext, any>>(
+    ...opt: [options: U] | (undefined extends TInput & TClientContext ? [] : never)
+  ) => IsEqual<U, QueryOptions<TInput, TOutput, TClientContext, any>> extends true
     ? { queryKey: QueryKey, queryFn: () => Promise<TOutput> }
     : Omit<{ queryKey: ComputedRef<QueryKey>, queryFn: () => Promise<TOutput> }, keyof U> & U
 
-  infiniteOptions: <U extends InfiniteOptions<TInput, TOutput, any>>(
+  infiniteOptions: <U extends InfiniteOptions<TInput, TOutput, TClientContext, any>>(
     options: U
   ) => Omit<{ queryKey: ComputedRef<QueryKey>, queryFn: () => Promise<TOutput>, initialPageParam: undefined }, keyof U> & U
 
-  mutationOptions: <U extends MutationOptions<TInput, TOutput>>(
-    options?: U
-  ) => IsEqual<U, MutationOptions<TInput, TOutput>> extends true
+  mutationOptions: <U extends MutationOptions<TInput, TOutput, TClientContext>>(
+    ...opt: [options: U] | (undefined extends TClientContext ? [] : never)
+  ) => IsEqual<U, MutationOptions<TInput, TOutput, TClientContext>> extends true
     ? { mutationKey: QueryKey, mutationFn: (input: TInput) => Promise<TOutput> }
     : Omit<{ mutationKey: QueryKey, mutationFn: (input: TInput) => Promise<TOutput> }, keyof U> & U
 }
 
-export function createProcedureUtils<TInput, TOutput>(
-  client: ProcedureClient<TInput, TOutput>,
+export function createProcedureUtils<TInput, TOutput, TClientContext>(
+  client: ProcedureClient<TInput, TOutput, TClientContext>,
   path: string[],
-): ProcedureUtils<TInput, TOutput> {
+): ProcedureUtils<TInput, TOutput, TClientContext> {
   return {
     queryOptions(...[options]) {
       const input = options?.input as any
 
       return {
         queryKey: computed(() => buildKey(path, { type: 'query', input: deepUnref(input) })),
-        queryFn: ({ signal }) => client(deepUnref(input), { signal }),
+        queryFn: ({ signal }) => client(deepUnref(input), { signal, context: deepUnref(options?.context) } as any),
         ...(options as any),
       }
     },
@@ -48,15 +48,15 @@ export function createProcedureUtils<TInput, TOutput>(
 
       return {
         queryKey: computed(() => buildKey(path, { type: 'infinite', input: deepUnref(input) })),
-        queryFn: ({ pageParam, signal }) => client({ ...deepUnref(input), cursor: pageParam }, { signal }),
+        queryFn: ({ pageParam, signal }) => client({ ...deepUnref(input), cursor: pageParam }, { signal, context: deepUnref(options.context) } as any),
         ...(options as any),
       }
     },
 
-    mutationOptions(options) {
+    mutationOptions(...[options]) {
       return {
         mutationKey: buildKey(path, { type: 'mutation' }),
-        mutationFn: input => client(input),
+        mutationFn: input => client(input, { context: deepUnref(options?.context) } as any),
         ...(options as any),
       }
     },
diff --git a/packages/vue-query/src/utils-router.test-d.ts b/packages/vue-query/src/utils-router.test-d.ts
index 488ec9b7..be71ea49 100644
--- a/packages/vue-query/src/utils-router.test-d.ts
+++ b/packages/vue-query/src/utils-router.test-d.ts
@@ -1,4 +1,6 @@
 import type { RouterClient } from '@orpc/server'
+import type { GeneralUtils } from './utils-general'
+import type { ProcedureUtils } from './utils-procedure'
 import { oc } from '@orpc/contract'
 import { os } from '@orpc/server'
 import { z } from 'zod'
@@ -23,7 +25,7 @@ const router = os.contract(contractRouter).router({
 
 describe('with contract router', () => {
   it('build correct types', () => {
-    const utils = createRouterUtils({} as RouterClient<typeof contractRouter>)
+    const utils = createRouterUtils({} as RouterClient<typeof contractRouter, unknown>)
 
     const generalUtils = createGeneralUtils([])
     const pingUtils = createProcedureUtils(ping, [])
@@ -41,7 +43,7 @@ describe('with contract router', () => {
 
 describe('with  router', () => {
   it('build correct types', () => {
-    const utils = createRouterUtils({} as RouterClient<typeof router>)
+    const utils = createRouterUtils({} as RouterClient<typeof router, unknown>)
 
     const generalUtils = createGeneralUtils([])
     const pingUtils = createProcedureUtils(ping, [])
@@ -56,3 +58,19 @@ describe('with  router', () => {
     expectTypeOf(utils.pong).toMatchTypeOf<typeof pongGeneralUtils>()
   })
 })
+
+it('with client context', () => {
+  const utils = createRouterUtils({} as RouterClient<typeof router, undefined | { batch?: boolean }>)
+
+  const generalUtils = {} as GeneralUtils<unknown>
+  const pingUtils = {} as ProcedureUtils<{ name: string }, string, undefined | { batch?: boolean }>
+  const pingGeneralUtils = createGeneralUtils<{ name: string }>(['ping'])
+  const pongUtils = {} as ProcedureUtils<number, string, undefined | { batch?: boolean }>
+  const pongGeneralUtils = {} as GeneralUtils<number>
+
+  expectTypeOf(utils).toMatchTypeOf<typeof generalUtils>()
+  expectTypeOf(utils.ping).toMatchTypeOf<typeof pingUtils>()
+  expectTypeOf(utils.ping).toMatchTypeOf<typeof pingGeneralUtils>()
+  expectTypeOf(utils.pong).toMatchTypeOf<typeof pongUtils>()
+  expectTypeOf(utils.pong).toMatchTypeOf<typeof pongGeneralUtils>()
+})
diff --git a/packages/vue-query/src/utils-router.ts b/packages/vue-query/src/utils-router.ts
index 1df8d268..5b7cb6f5 100644
--- a/packages/vue-query/src/utils-router.ts
+++ b/packages/vue-query/src/utils-router.ts
@@ -2,18 +2,18 @@ import type { ProcedureClient, RouterClient } from '@orpc/server'
 import { createGeneralUtils, type GeneralUtils } from './utils-general'
 import { createProcedureUtils, type ProcedureUtils } from './utils-procedure'
 
-export type RouterUtils<T extends RouterClient<any>> =
-  T extends ProcedureClient<infer TInput, infer TOutput>
-    ? ProcedureUtils<TInput, TOutput> & GeneralUtils<TInput>
+export type RouterUtils<T extends RouterClient<any, any>> =
+  T extends ProcedureClient<infer TInput, infer TOutput, infer TClientContext>
+    ? ProcedureUtils<TInput, TOutput, TClientContext> & GeneralUtils<TInput>
     : {
-      [K in keyof T]: T[K] extends RouterClient<any> ? RouterUtils<T[K]> : never
+      [K in keyof T]: T[K] extends RouterClient<any, any> ? RouterUtils<T[K]> : never
     } & GeneralUtils<unknown>
 
 /**
  * @param client - The client create form `@orpc/client`
  * @param path - The base path for query key
  */
-export function createRouterUtils<T extends RouterClient<any>>(
+export function createRouterUtils<T extends RouterClient<any, any>>(
   client: T,
   path: string[] = [],
 ): RouterUtils<T> {
diff --git a/packages/vue-query/tests/e2e.test-d.ts b/packages/vue-query/tests/e2e.test-d.ts
index c6f209b7..c4fa2061 100644
--- a/packages/vue-query/tests/e2e.test-d.ts
+++ b/packages/vue-query/tests/e2e.test-d.ts
@@ -34,6 +34,16 @@ describe('useQuery', () => {
     // @ts-expect-error input is invalid
     useQuery(orpc.user.find.queryOptions({ input: { id: 123 } }))
   })
+
+  it('infer types correctly with client context', async () => {
+    useQuery(orpc.user.find.queryOptions({ input: { id: '123' } }))
+    useQuery(orpc.user.find.queryOptions({ input: { id: '123' }, context: { batch: true } }))
+    useQuery(orpc.user.find.queryOptions({ input: { id: '123' }, context: { batch: ref(false) } }))
+    // @ts-expect-error --- invalid context
+    useQuery(orpc.user.find.queryOptions({ input: { id: '123' }, context: { batch: 'invalid' } }))
+    // @ts-expect-error --- invalid context
+    useQuery(orpc.user.find.queryOptions({ input: { id: '123' }, context: { batch: ref('invalid') } }))
+  })
 })
 
 describe('useInfiniteQuery', () => {
@@ -102,6 +112,37 @@ describe('useInfiniteQuery', () => {
       getNextPageParam: {} as any,
     }))
   })
+
+  it('infer types correctly with client context', async () => {
+    useInfiniteQuery(orpc.user.list.infiniteOptions({
+      input: { keyword: 'keyword' },
+      getNextPageParam: {} as any,
+    }))
+    useInfiniteQuery(orpc.user.list.infiniteOptions({
+      input: { keyword: 'keyword' },
+      getNextPageParam: {} as any,
+      context: { batch: true },
+    }))
+    useInfiniteQuery(orpc.user.list.infiniteOptions({
+      input: { keyword: 'keyword' },
+      getNextPageParam: {} as any,
+      context: { batch: ref(true) },
+    }))
+    // @ts-expect-error --- invalid context
+    useInfiniteQuery(orpc.user.list.infiniteOptions({
+      input: { keyword: 'keyword' },
+      getNextPageParam: {} as any,
+      // @ts-expect-error --- invalid context
+      context: { batch: 'invalid' },
+    }))
+    // @ts-expect-error --- invalid context
+    useInfiniteQuery(orpc.user.list.infiniteOptions({
+      input: { keyword: 'keyword' },
+      getNextPageParam: {} as any,
+      // @ts-expect-error --- invalid context
+      context: { batch: ref('invalid') },
+    }))
+  })
 })
 
 describe('useMutation', () => {
@@ -116,6 +157,16 @@ describe('useMutation', () => {
 
     expectTypeOf(query.mutateAsync).toMatchTypeOf<(input: { id: string }) => Promise<{ id: string, name: string }>>()
   })
+
+  it('infer types correctly with client context', async () => {
+    useMutation(orpc.user.find.mutationOptions(({})))
+    useMutation(orpc.user.find.mutationOptions(({ context: { batch: true } })))
+    useMutation(orpc.user.find.mutationOptions(({ context: { batch: ref(false) } })))
+    // @ts-expect-error --- invalid context
+    useMutation(orpc.user.find.mutationOptions(({ context: { batch: 'invalid' } })))
+    // @ts-expect-error --- invalid context
+    useMutation(orpc.user.find.mutationOptions(({ context: { batch: ref('invalid') } })))
+  })
 })
 
 describe('useQueries', () => {
@@ -191,4 +242,32 @@ describe('useQueries', () => {
       ],
     })
   })
+
+  it('infer types correctly with client context', async () => {
+    useQueries({
+      queries: [
+        orpc.user.find.queryOptions({
+          input: { id: '0' },
+        }),
+        orpc.user.find.queryOptions({
+          input: { id: '0' },
+          context: { batch: true },
+        }),
+        orpc.user.find.queryOptions({
+          input: { id: '0' },
+          context: { batch: ref(false) },
+        }),
+        orpc.user.find.queryOptions({
+          input: { id: '0' },
+          // @ts-expect-error --- invalid context
+          context: { batch: 'invalid' },
+        }),
+        orpc.user.find.queryOptions({
+          input: { id: '0' },
+          // @ts-expect-error --- invalid context
+          context: { batch: ref('invalid') },
+        }),
+      ],
+    })
+  })
 })
diff --git a/packages/vue-query/tests/helpers.ts b/packages/vue-query/tests/helpers.ts
index 7374e4e2..5ebe5757 100644
--- a/packages/vue-query/tests/helpers.ts
+++ b/packages/vue-query/tests/helpers.ts
@@ -1,4 +1,5 @@
-import { createORPCFetchClient } from '@orpc/client'
+import { createClient } from '@orpc/client'
+import { ORPCLink } from '@orpc/client/fetch'
 import { os } from '@orpc/server'
 import { ORPCHandler } from '@orpc/server/fetch'
 import { QueryClient } from '@tanstack/vue-query'
@@ -87,16 +88,18 @@ export const appRouter = orpcServer.router({
 
 const orpcHandler = new ORPCHandler(appRouter)
 
-export const orpcClient = createORPCFetchClient<typeof appRouter>({
-  baseURL: 'http://localhost:3000',
+const orpcLink = new ORPCLink({
+  url: 'http://localhost:3000',
 
-  async fetch(...args) {
+  async fetch(input, init) {
     await new Promise(resolve => setTimeout(resolve, 100))
-    const request = new Request(...args)
+    const request = new Request(input, init)
     return orpcHandler.fetch(request)
   },
 })
 
+export const orpcClient = createClient<typeof appRouter, { batch?: boolean } | undefined>(orpcLink)
+
 export const orpc = createORPCVueQueryUtils(orpcClient)
 
 export const queryClient = new QueryClient({