Flows Vite plugin API - Cognite Docs

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

Run your app locally — Complete local development guide
Get started with Cognite Flows — Project setup and configuration
Content Security Policy — Production CSP baseline and how to extend it via manifest.json

fusionOpenPlugin

Opens your app in CDF when the dev server starts.

// 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:

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

Generated URL

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:

{
  "deployments": [
    {
      "org": "my-org",
      "project": "my-project",
      "baseUrl": "https://greenfield.cognitedata.com"
    }
  ]
}

Disabling auto-open

Remove the plugin from vite.config.ts:

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

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

​Prerequisites

​Related guides

​fusionOpenPlugin

​Behavior

​Generated URL

​Requirements

​Disabling auto-open