Beta You're reading the docs for Kubb v5, which is currently in beta. View the stable v4 docs
Skip to content

Migration: @kubb/plugin-vue-query

Part of the v4 → v5 migration guide. For the full option reference, see @kubb/plugin-vue-query.

resolver.resolveName replaces transformers.name. The v4 transformers object held only name, so that is the whole rename. To rewrite generated nodes before printing, use the new macros option.

client is a selector, not an object

In v4 the client option carried the whole client config, including dataReturnType, clientType, baseURL, bundle, and the custom importPath. v5 drops the object form. The composables no longer emit their own client. They call a registered client plugin instead, so you register @kubb/plugin-axios or @kubb/plugin-fetch and point client at it with the string 'axios' or 'fetch'. When exactly one client plugin is registered, leave client off and the plugin picks it up. Set the string only to disambiguate when both are registered.

typescript
import { defineConfig } from '@kubb/core'
import { pluginVueQuery } from '@kubb/plugin-vue-query'

export default defineConfig({
  plugins: [
    pluginVueQuery({
      client: { client: 'axios', dataReturnType: 'data', baseURL: 'https://api.example.com' },
    }),
  ],
})
typescript
import { defineConfig } from 'kubb'
import { pluginTs } from '@kubb/plugin-ts'
import { pluginAxios } from '@kubb/plugin-axios'
import { pluginVueQuery } from '@kubb/plugin-vue-query'

export default defineConfig({
  plugins: [
    pluginTs(),
    pluginAxios({ baseURL: 'https://api.example.com' }),
    pluginVueQuery({ client: 'axios' }),
  ],
})

dataReturnType has no replacement on the query plugin. The client plugin returns the response body, so the composables read res.data. Move baseURL to the client plugin, and see Migration: @kubb/plugin-client removed for the clientType, bundle, and importPath options that went with it.

Renamed: parservalidator

The parser option is now validator. Set validator: 'zod' where you previously set parser: 'zod'. The accepted values are unchanged: false, 'zod', or { request: 'zod', response: 'zod' } to validate request and response bodies with schemas from @kubb/plugin-zod.

Diff
diff
  pluginVueQuery({
   parser: 'zod',
   validator: 'zod',
  })

Removed: generators

The generators option is gone. Plugins no longer accept extra generators inline. Move custom output into your own plugin. See Creating plugins.

Removed: paramsType, pathParamsType, paramsCasing

These three options are gone, including client.paramsCasing. Each composable now takes its parameters as a single grouped options object shaped as { path, query, body, headers }, with camelCase property names. This matches the shape @kubb/plugin-fetch already used. Query params move under query, path params under path, the request body under body, and header params under headers.

Diff
diff
  pluginVueQuery({
   paramsType: 'object',
   pathParamsType: 'object',
   paramsCasing: 'camelcase',
  })

Update the call sites. Query params move into query, and path params move into path. When an operation has a required parameter in a group, that group (path, query, or headers) is required too, so an incomplete call fails to compile.

typescript
useFindPets({ status: 'available' })
useGetPet(petId)
useUpdatePet().mutate({ petId, data: pet })
typescript
useFindPets({ query: { status: 'available' } })
useGetPet({ path: { petId } })
useUpdatePet().mutate({ path: { petId }, body: pet })

The first argument is typed Omit<XxxRequestConfig, 'url'>, the RequestConfig type @kubb/plugin-ts generates. The trailing config argument is unchanged.

hooks defaults to false

The hooks option controls whether use* composables are emitted alongside the factory helpers. Its default changed from true to false, so existing configs that relied on generated composables must now opt in explicitly.

kubb.config.ts
diff
  pluginVueQuery({
    output: { path: './hooks' },
   hooks: true,
  })

With hooks: false (the default) the plugin still emits queryOptions, mutationOptions, queryKey, and mutationKey. Only the useQuery, useInfiniteQuery, and useMutation wrappers are skipped.

Generated output

The generated output changes match React Query. The *MutationKey type alias is gone, TData narrows to 2xx responses, required params are enforced in the type, and the auto enabled guard is dropped. The client call still unwraps each grouped option with toValue() so refs and getters resolve. See Generated output: @kubb/plugin-react-query.