> **Version 8** — **React** / **TypeScript**
> Also available:
- `?renderer=preact` for preact
- `?language=js` for JavaScript
- `?codeOnly=true` for code snippets only
- other versions: Version 10.3 (latest) (`/docs/get-started/frameworks/preact-vite.md`), Version 9 (`/docs/9/get-started/frameworks/preact-vite.md`)

# Storybook for Preact & Vite

Storybook for Preact & Vite is a [framework](../../contribute/framework.mdx) that makes it easy to develop and test UI components in isolation for [Preact](https://preactjs.com/) applications built with [Vite](https://vitejs.dev/). It includes:

* 🏎️ Pre-bundled for performance
* 🪄 Zero config
* 💫 and more!

## Requirements

* Preact 8.x || 10.x
* Vite ≥ 4.0
* Storybook ≥ 8.0

## Getting started

### In a project without Storybook

Follow the prompts after running this command in your Preact project's root directory:

```shell
npm create storybook@latest
```

```shell
pnpm create storybook@latest
```

```shell
yarn create storybook@latest
```

[More on getting started with Storybook.](../install.mdx)

### In a project with Storybook

This framework is designed to work with Storybook 7+. If you’re not already using v7, upgrade with this command:

```shell
npx storybook@latest upgrade
```

```shell
pnpm dlx storybook@latest upgrade
```

```shell
yarn dlx storybook@latest upgrade
```

#### Automatic migration

When running the `upgrade` command above, you should get a prompt asking you to migrate to `@storybook/preact-vite`, which should handle everything for you. In case that auto-migration does not work for your project, refer to the manual migration below.

#### Manual migration

First, install the framework:

Then, update your `.storybook/main.js|ts` to change the framework property:

## API

### Options

You can pass an options object for additional configuration if needed:

#### `builder`

Type: `Record<string, any>`

Configure options for the [framework's builder](../../api/main-config/main-config-framework.mdx#optionsbuilder). For this framework, available options can be found in the [Vite builder docs](../../builders/vite.mdx).