> ## Documentation Index
> Fetch the complete documentation index at: https://docs.cognite.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Flows Vite plugin API

> Reference for Flows Vite plugins, including fusionOpenPlugin and Cognite Data Fusion (CDF) development URLs.

Vite plugin API for Flows local development.

Use this API when customizing your Flows app's Vite configuration or when you need to understand how the development server integrates with CDF. The `fusionOpenPlugin` automatically opens your app in the CDF interface during local development.

## Prerequisites

* Flows app with Vite development environment
* `app.json` configuration file with deployment settings

## Related guides

* [Run your app locally](/cdf/flows/guides/running-locally) — Complete local development guide
* [Get started with Cognite Flows](/cdf/flows/guides/getting-started) — Project setup and configuration
* [Content Security Policy](/cdf/flows/reference/api/csp) — Production CSP baseline and how to extend it via `manifest.json`

## fusionOpenPlugin

Opens your app in CDF when the dev server starts.

```ts theme={"languages":{"custom":["/_languages/kuiper.json","../_languages/kuiper.json"]}}
// vite.config.ts
import { fusionOpenPlugin } from "@cognite/app-sdk/vite";
import react from "@vitejs/plugin-react";
import { defineConfig } from "vite";

export default defineConfig({
  plugins: [react(), fusionOpenPlugin()],
});
```

### Behavior

When the Vite dev server starts, the plugin:

1. Reads `app.json` from the current directory
2. Extracts `org`, `project`, and `baseUrl` from the first deployment
3. Opens your browser to the CDF development URL

### Generated URL

```text theme={"languages":{"custom":["/_languages/kuiper.json","../_languages/kuiper.json"]}}
https://{org}.fusion.cognite.com/{project}/flows-apps/development/{appExternalId}/{port}?cluster={cluster}&workspace={workspace}
```

### Requirements

The plugin requires an `app.json` file with at least one deployment:

```json theme={"languages":{"custom":["/_languages/kuiper.json","../_languages/kuiper.json"]}}
{
  "deployments": [
    {
      "org": "my-org",
      "project": "my-project",
      "baseUrl": "https://greenfield.cognitedata.com"
    }
  ]
}
```

### Disabling auto-open

Remove the plugin from `vite.config.ts`:

```ts theme={"languages":{"custom":["/_languages/kuiper.json","../_languages/kuiper.json"]}}
export default defineConfig({
  plugins: [
    react(),
    // fusionOpenPlugin(), // Disabled
  ],
});
```

If `app.json` is missing, the plugin skips silently.
