Nuxt-only OpenAPI generation

Quick Start ​

Install the package and configure the Nuxt module:

npm install nuxt-openapi-hyperfetch

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['nuxt-openapi-hyperfetch'],

  openapi: {
    input: './swagger.yaml',
    output: './openapi',
    generators: ['useAsyncData', 'connectors', 'nuxtServer'],
    enableAutoImport: true,
  },
})

Run your Nuxt app or build and the module generates the requested artifacts before the Nuxt build lifecycle continues.

What Gets Generated ​

The generated root is openapi/. It contains the OpenAPI client plus any enabled helper layers:

openapi/
  index.ts
  sdk.gen.ts
  types.gen.ts
  client.gen.ts
  client/
  core/
  composables/

Depending on your generators configuration, openapi/composables/ can contain:

• useFetch composables
• useAsyncData composables
• Headless CRUD connectors

When nuxtServer is enabled, server routes are generated outside openapi/, under server/routes/api by default.

Generated Composables ​

With useAsyncData enabled, the generated composables are immediately usable from Nuxt:

<script setup lang="ts">
const { data: pet, pending, error } = await useAsyncDataGetPetById({
  path: { petId: 123 },
})

const { data: rawPet, status, headers } = await useAsyncDataGetPetByIdRaw({
  path: { petId: 123 },
})

watchEffect(() => {
  console.log(pet.value?.name)
  console.log(rawPet.value)
  console.log(status.value)
  console.log(headers.value)
})
</script>

If you enable useFetch, the module also generates the parallel openapi/composables/use-fetch/ tree.

Server Routes and Connectors ​

Optional generators stay explicit:

• nuxtServer writes route handlers to server/routes/api by default
• connectors depends on useAsyncData and writes connector composables under openapi/composables/connectors

Those layers are additive. You can keep the generated OpenAPI client only, add composables, or add server routes and connectors on top.

Base URL Configuration ​

Generated composables and connectors can read the public runtime base URL from Nuxt:

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['nuxt-openapi-hyperfetch'],

  runtimeConfig: {
    public: {
      apiBaseUrl: process.env.NUXT_PUBLIC_API_BASE_URL || 'https://api.example.com',
    },
  },
})

Connectors ​

const { getAll, get, create, update, del } = usePetsConnector()

What's Next? ​