# openapi-fetch > Fast, type-safe fetch client for your OpenAPI schema. Only 6 kb (min). Works with React, Vue, Svelte, or vanilla JS. Latest version **0.17.0** (published 2026-02-11) · MIT license · 0 weekly downloads ## Install ```sh npm install openapi-fetch pnpm add openapi-fetch yarn add openapi-fetch bun add openapi-fetch ``` ## Health **Score 70/100 (B)** — status: stable. Positive: has types; esm support; no vulnerabilities; has provenance; high maintenance score; high quality score. Warnings: low downloads; pre 1.0. ## Facts | | | |---|---| | Version | 0.17.0 | | Published | 2026-02-11 | | First published | 2023-03-14 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Dependencies | 1 | | Unpacked size | 223.4 KB | | Known vulnerabilities | 0 | | Install scripts | no | | Provenance | attested (GitHub Actions) | | GitHub stars | 8367 | | Author | Drew Powers | | Maintainers | drewpowers, mpaucot, gzm0 | | Keywords | openapi, swagger, rest, api, oapi_3, oapi_3_1, typescript, fetch, react, vue, svelte | ## Links - npm: https://www.npmjs.com/package/openapi-fetch - Repository: https://github.com/openapi-ts/openapi-typescript - Homepage: https://openapi-ts.dev - Issues: https://github.com/openapi-ts/openapi-typescript/issues - npm.io page: https://npm.io/package/openapi-fetch ## Dependencies (1) - [openapi-typescript-helpers](https://npm.io/package/openapi-typescript-helpers.md) ^0.1.0 ## Alternatives - [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads - [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads - [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads - [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads - [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads ## Recent versions - 0.17.0 (latest) — 2026-02-11 - 0.16.0 — 2026-02-08 - 0.15.2 — 2026-02-08 - 0.15.0 — 2025-10-14 - 0.14.1 — 2025-10-02 - 0.14.0 — 2025-05-10 - 0.13.8 — 2025-05-10 - 0.13.7 — 2025-05-05 - 0.13.6 — 2025-05-03 - 0.13.5 — 2025-03-14 - 0.13.4 — 2025-01-03 - 0.13.3 — 2024-12-04 - 0.13.2 — 2024-12-02 - 0.13.1 — 2024-12-01 - 0.13.0 — 2024-10-25 - … 66 more at https://npm.io/package/openapi-fetch/versions ## README openapi-fetch openapi-fetch is a type-safe fetch client that pulls in your OpenAPI schema. Weighs **6 kb** and has virtually zero runtime. Works with React, Vue, Svelte, or vanilla JS. | Library | Size (min) | “GET” request\* | | :------------------------- | ---------: | :------------------------- | | openapi-fetch | `6 kB` | `300k` ops/s (fastest) | | openapi-typescript-fetch | `3 kB` | `300k` ops/s (fastest) | | feature-fetch | `15 kB` | `300k` ops/s (fastest) | | axios | `32 kB` | `225k` ops/s (1.3× slower) | | superagent | `55 kB` | `50k` ops/s (6× slower) | | openapi-typescript-codegen | `367 kB` | `100k` ops/s (3× slower) | _\* [Benchmarks are approximate](https://github.com/openapi-ts/openapi-typescript/blob/main/packages/openapi-fetch/test/index.bench.js) to just show rough baseline and will differ among machines and browsers. The relative performance between libraries is more reliable._ The syntax is inspired by popular libraries like react-query or Apollo client, but without all the bells and whistles and in a 6 kb package. ```ts import createClient from "openapi-fetch"; import type { paths } from "./my-openapi-3-schema"; // generated by openapi-typescript const client = createClient({ baseUrl: "https://myapi.dev/v1/" }); const { data, // only present if 2XX response error, // only present if 4XX or 5XX response } = await client.GET("/blogposts/{post_id}", { params: { path: { post_id: "123" }, }, }); await client.PUT("/blogposts", { body: { title: "My New Post", }, }); ``` `data` and `error` are typechecked and expose their shapes to Intellisense in VS Code (and any other IDE with TypeScript support). Likewise, the request `body` will also typecheck its fields, erring if any required params are missing, or if there’s a type mismatch. `GET()`, `PUT()`, `POST()`, etc. are thin wrappers around the native [fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) (which you can [swap for any call](https://openapi-ts.dev/openapi-fetch/api/#create-client)). Notice there are no generics, and no manual typing. Your endpoint’s request and response were inferred automatically. This is a huge improvement in the type safety of your endpoints because **every manual assertion could lead to a bug**! This eliminates all of the following: - ✅ No typos in URLs or params - ✅ All parameters, request bodies, and responses are type-checked and 100% match your schema - ✅ No manual typing of your API - ✅ Eliminates `any` types that hide bugs - ✅ Also eliminates `as` type overrides that can also hide bugs - ✅ All of this in a **6 kb** client package 🎉 ## Setup Install this library along with [openapi-typescript](../openapi-typescript): ```bash npm i openapi-fetch npm i -D openapi-typescript typescript ``` > **Highly recommended** > > Enable [noUncheckedIndexedAccess](https://www.typescriptlang.org/tsconfig#noUncheckedIndexedAccess) in your `tsconfig.json` ([docs](/advanced#enable-nouncheckedindexaccess-in-your-tsconfigjson)) Next, generate TypeScript types from your OpenAPI schema using openapi-typescript: ```bash npx openapi-typescript ./path/to/api/v1.yaml -o ./src/lib/api/v1.d.ts ``` Lastly, be sure to **run typechecking** in your project. This can be done by adding `tsc --noEmit` to your [npm scripts](https://docs.npmjs.com/cli/v9/using-npm/scripts) like so: ```json { "scripts": { "test:ts": "tsc --noEmit" } } ``` And run `npm run test:ts` in your CI to catch type errors. > **TIP:** > > Use `tsc --noEmit` to check for type errors rather than relying on your linter or your build command. Nothing will typecheck as accurately as the TypeScript compiler itself. ## Basic usage The best part about using openapi-fetch over oldschool codegen is no documentation needed. openapi-fetch encourages using your existing OpenAPI documentation rather than trying to find what function to import, or what parameters that function wants: ![OpenAPI schema example](../../docs/public/assets/openapi-schema.png) ```ts import createClient from "openapi-fetch"; import type { paths } from "./my-openapi-3-schema"; // generated by openapi-typescript const client = createClient({ baseUrl: "https://myapi.dev/v1/" }); const { data, error } = await client.GET("/blogposts/{post_id}", { params: { path: { post_id: "my-post" }, query: { version: 2 }, }, }); const { data, error } = await client.PUT("/blogposts", { body: { title: "New Post", body: "

New post body

", publish_date: new Date("2023-03-01T12:00:00Z").getTime(), }, }); ``` 1. The HTTP method is pulled directly from `createClient()` 2. You pass in your desired `path` to `GET()`, `PUT()`, etc. 3. TypeScript takes over the rest and returns helpful errors for anything missing or invalid ## 📓 Docs [View Docs](https://openapi-ts.dev/openapi-fetch/) --- _Source: https://npm.io/package/openapi-fetch · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._