···11+---
22+title: Vite Plugin
33+description: Integrate @hey-api/openapi-ts into your Vite build pipeline with the official Vite plugin.
44+---
55+66+# Vite
77+88+### About
99+1010+[Vite](https://vite.dev) is a blazing fast frontend build tool powering the next generation of web applications.
1111+1212+The Vite plugin integrates `@hey-api/openapi-ts` into the Vite build pipeline, running automatically whenever Vite resolves its configuration – no separate script or manual step required.
1313+1414+## Features
1515+1616+- runs automatically as part of your Vite build
1717+- reads your existing [configuration](/openapi-ts/get-started) (or accepts inline config)
1818+- works with any Vite-based project
1919+2020+## Installation
2121+2222+You can download `@hey-api/vite-plugin` from npm using your favorite package manager.
2323+2424+::: code-group
2525+2626+```sh [npm]
2727+npm add @hey-api/vite-plugin -D -E
2828+```
2929+3030+```sh [pnpm]
3131+pnpm add @hey-api/vite-plugin -D -E
3232+```
3333+3434+```sh [yarn]
3535+yarn add @hey-api/vite-plugin -D -E
3636+```
3737+3838+```sh [bun]
3939+bun add @hey-api/vite-plugin -D -E
4040+```
4141+4242+:::
4343+4444+## Usage
4545+4646+Add the plugin to your `vite.config.ts`:
4747+4848+::: code-group
4949+5050+```ts [vite.config.ts]
5151+import { heyApiPlugin } from '@hey-api/vite-plugin';
5252+import { defineConfig } from 'vite';
5353+5454+export default defineConfig({
5555+ plugins: [heyApiPlugin()],
5656+});
5757+```
5858+5959+:::
6060+6161+The plugin will automatically pick up your [configuration](/openapi-ts/configuration) file. You can also pass options inline using the `config` option:
6262+6363+::: code-group
6464+6565+```ts [vite.config.ts]
6666+import { heyApiPlugin } from '@hey-api/vite-plugin';
6767+import { defineConfig } from 'vite';
6868+6969+export default defineConfig({
7070+ plugins: [
7171+ heyApiPlugin({
7272+ config: {
7373+ input: 'hey-api/backend', // sign up at app.heyapi.dev
7474+ output: 'src/client',
7575+ },
7676+ }),
7777+ ],
7878+});
7979+```
8080+8181+:::
8282+8383+<!--@include: ../../partials/examples.md-->
8484+<!--@include: ../../partials/sponsors.md-->
+49-1
docs/openapi-ts/get-started.md
···5151::: code-group
52525353```sh [npm]
5454-npm install @hey-api/openapi-ts -D -E
5454+npm add @hey-api/openapi-ts -D -E
5555```
56565757```sh [pnpm]
···104104```
105105106106:::
107107+108108+### Vite
109109+110110+If you're using [Vite](https://vite.dev), you can integrate `@hey-api/openapi-ts` directly into your build pipeline with `@hey-api/vite-plugin`. Install it alongside the main package:
111111+112112+::: code-group
113113+114114+```sh [npm]
115115+npm add @hey-api/vite-plugin -D -E
116116+```
117117+118118+```sh [pnpm]
119119+pnpm add @hey-api/vite-plugin -D -E
120120+```
121121+122122+```sh [yarn]
123123+yarn add @hey-api/vite-plugin -D -E
124124+```
125125+126126+```sh [bun]
127127+bun add @hey-api/vite-plugin -D -E
128128+```
129129+130130+:::
131131+132132+Then add the plugin to your Vite configuration:
133133+134134+::: code-group
135135+136136+```ts [vite.config.ts]
137137+import { heyApiPlugin } from '@hey-api/vite-plugin';
138138+import { defineConfig } from 'vite';
139139+140140+export default defineConfig({
141141+ plugins: [
142142+ heyApiPlugin({
143143+ config: {
144144+ input: 'hey-api/backend', // sign up at app.heyapi.dev
145145+ output: 'src/client',
146146+ },
147147+ }),
148148+ ],
149149+});
150150+```
151151+152152+:::
153153+154154+See the [Vite](/openapi-ts/configuration/vite) page for full configuration options.
107155108156### Configuration
109157
+1-1
docs/openapi-ts/migrating.md
···479479480480### Bundle `@hey-api/client-*` plugins
481481482482-In previous releases, you had to install a separate client package to generate a fully working output, e.g., `npm install @hey-api/client-fetch`. This created a few challenges: getting started was slower, upgrading was sometimes painful, and bundling too. Beginning with v0.73.0, all Hey API clients are bundled by default and don't require installing any additional dependencies. You can remove any installed client packages and re-run `@hey-api/openapi-ts`.
482482+In previous releases, you had to install a separate client package to generate a fully working output, e.g., `npm add @hey-api/client-fetch`. This created a few challenges: getting started was slower, upgrading was sometimes painful, and bundling too. Beginning with v0.73.0, all Hey API clients are bundled by default and don't require installing any additional dependencies. You can remove any installed client packages and re-run `@hey-api/openapi-ts`.
483483484484```sh
485485npm uninstall @hey-api/client-fetch
+1-1
docs/openapi-ts/plugins/sdk.md
···540540541541### Display
542542543543-Enabling examples does not produce visible output on its own. Examples are written into the source specification and can be consumed by documentation tools such as [Mintlify](https://kutt.to/6vrYy9) or [Scalar](https://kutt.to/skQUVd). To persist that specification, enable [Source](/openapi-ts/configuration/output#source) generation.
543543+Enabling examples does not produce visible output on its own. Examples are written into the source specification and can be consumed by documentation tools such as [Scalar](https://kutt.to/skQUVd). To persist that specification, enable [Source](/openapi-ts/configuration/output#source) generation.
544544545545## API
546546
···1636163616371637 ### Bundle `@hey-api/client-*` plugins
1638163816391639- In previous releases, you had to install a separate client package to generate a fully working output, e.g. `npm install @hey-api/client-fetch`. This created a few challenges: getting started was slower, upgrading was sometimes painful, and bundling too. Beginning with v0.73.0, all Hey API clients are bundled by default and don't require installing any additional dependencies. You can remove any installed client packages and re-run `@hey-api/openapi-ts`.
16391639+ In previous releases, you had to install a separate client package to generate a fully working output, e.g. `npm add @hey-api/client-fetch`. This created a few challenges: getting started was slower, upgrading was sometimes painful, and bundling too. Beginning with v0.73.0, all Hey API clients are bundled by default and don't require installing any additional dependencies. You can remove any installed client packages and re-run `@hey-api/openapi-ts`.
1640164016411641 ```sh
16421642 npm uninstall @hey-api/client-fetch
+51-1
packages/openapi-ts/README.md
···171171#### npm
172172173173```sh
174174-npm install @hey-api/openapi-ts -D -E
174174+npm add @hey-api/openapi-ts -D -E
175175```
176176177177#### pnpm
···226226 output: 'src/client',
227227});
228228```
229229+230230+### Vite
231231+232232+If you're using [Vite](https://vite.dev), you can integrate `@hey-api/openapi-ts` directly into your build pipeline with `@hey-api/vite-plugin`. Install it alongside the main package:
233233+234234+#### npm
235235+236236+```sh
237237+npm add @hey-api/vite-plugin -D -E
238238+```
239239+240240+#### pnpm
241241+242242+```sh
243243+pnpm add @hey-api/vite-plugin -D -E
244244+```
245245+246246+#### yarn
247247+248248+```sh
249249+yarn add @hey-api/vite-plugin -D -E
250250+```
251251+252252+#### bun
253253+254254+```sh
255255+bun add @hey-api/vite-plugin -D -E
256256+```
257257+258258+Then add the plugin to your Vite configuration:
259259+260260+#### `vite.config.ts`
261261+262262+```ts
263263+import { heyApiPlugin } from '@hey-api/vite-plugin';
264264+import { defineConfig } from 'vite';
265265+266266+export default defineConfig({
267267+ plugins: [
268268+ heyApiPlugin({
269269+ config: {
270270+ input: 'hey-api/backend', // sign up at app.heyapi.dev
271271+ output: 'src/client',
272272+ },
273273+ }),
274274+ ],
275275+});
276276+```
277277+278278+See the [Vite](https://heyapi.dev/openapi-ts/configuration/vite) page for full configuration options.
229279230280## Configuration
231281