Basics
Learn the fundamentals of configuring Orval
Start by generating or defining an OpenAPI specification (example petstore.yaml).
Then create a file orval.config.ts at the root of your project.
Basic Configuration
import { defineConfig } from 'orval';
export default defineConfig({
petstore: {
output: {
mode: 'single',
target: './src/petstore.ts',
schemas: './src/model',
client: 'react-query',
httpClient: 'fetch',
mock: true,
},
input: {
target: './petstore.yaml',
},
},
});Output Options
The output options configure how and where you want to write the generated code.
| Option | Description |
|---|---|
mode | Specifies how files are generated. Default: single (one file with everything) |
target | Specifies where the generated file(s) will be written |
schemas | Specifies where the models will be written |
client | Selects the generated client: angular, angular-query, axios, axios-functions, react-query, solid-start, solid-query, svelte-query, vue-query, swr, zod, effect, hono, fetch, or mcp |
httpClient | Selects the request transport: fetch (default), axios, or angular. The available transport depends on the selected client. |
mock | Generates mocks with MSW. See the MSW guide |
client and httpClient control different parts of the generated output. The
client selects the generated API style, while httpClient selects the
request implementation used by compatible clients. For example, the
configuration above generates React Query hooks backed by the Fetch API.
Input Options
The input options configure the imported specification and any optional overrides.
| Option | Description |
|---|---|
target | Path or URL to the OpenAPI specification file |
override.transformer | Transform the specification (e.g., add a parameter to every request) |