Editors

VS Code and Cursor

What you will be able to do: open a uf project in VS Code or Cursor and see only uf's diagnostics, with uf's hover, go to definition, completion, quick fixes and formatting.

What you need first: uf installed, a project with a uf.config.js, and what the server answers.

What goes wrong without it

Open a Flow component in a fresh VS Code and its built-in "TypeScript and JavaScript Language Features" extension reads it as TypeScript:

Type annotations can only be used in TypeScript files.  ts(8010)
';' expected.  ts(1005)

Those come from VS Code, not from uf, and no setting of uf's can remove them. They go away when VS Code's validation of JavaScript is turned off for the project.

1. Install the extension

The extension is uniflowed.uf. Cursor installs the same one. From a terminal, uf editor install vscode (or cursor) downloads the extension that matches your uf from its GitHub release, checks it against the published sha256, and installs it with the editor's own --install-extension. Or, from the registries:

code --install-extension uniflowed.uf      # VS Code, from the Marketplace
cursor --install-extension uniflowed.uf    # Cursor, from Open VSX

A release reaches the Marketplace and Open VSX only once the repository owner has set the publishing tokens. Until then, or to run your own build, package it from a checkout and install the .vsix, as editors/vscode describes. The extension starts the project's own uf (node_modules/.bin/uf) before one on PATH, one server per folder that has a uf.config.js.

2. Turn off VS Code's JavaScript validation, for this project

uf editor setup vscode (or cursor) writes the settings below and the recommendation. It adds what is missing, keeps anything the project already sets, and prints each line it adds. By hand, commit this as .vscode/settings.json in the project:

{
  // VS Code before 1.110, and Cursor.
  "javascript.validate.enable": false,
  "[javascript]": {
    // VS Code 1.110 and later. Also covers .jsx.
    "js/ts.validate.enabled": false,
    "editor.defaultFormatter": "uniflowed.uf",
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": { "source.fixAll.uf": "explicit" }
  },
  "[javascriptreact]": {
    "editor.defaultFormatter": "uniflowed.uf",
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": { "source.fixAll.uf": "explicit" }
  }
}

What each part does:

• The two validation lines are one switch with two names. VS Code 1.110 (February 2026) renamed javascript.validate.enable to js/ts.validate.enabled. It still reads the old name, but only while the new one has no value anywhere, including a "[typescript]" block in your user settings. Writing both covers every VS Code. Cursor's extension API is older than 1.110 and has only the old name. It shows the new key as unknown and ignores it.
• "[javascript]" covers .jsx too. VS Code reads the validation setting under the javascript language id for both. A "[javascriptreact]" block alone would be ignored for validation.
• Validation off removes syntax, semantic and suggestion diagnostics for JavaScript only. .ts and .tsx files are checked as before, because TypeScript's switch is a separate setting and nothing here touches it.
• The formatter lines make Format Document and format on save use uf, which formats to this project's uf.config.js. source.fixAll.uf applies every safe uf lint fix on save.

The extension writes the two validation lines by itself the first time it starts a server in a folder with a uf.config.js. It writes only to that folder, never over a value the project set, and only once, so deleting the lines sticks. The notification it shows has an Undo, and "uf.workspace.disableBuiltinValidation": false turns the behaviour off. uf: Configure Workspace for Flow writes the full block above, after listing what it will write.

Commit .vscode/extensions.json as well, so VS Code offers the extension to everyone who opens the project:

{ "recommendations": ["uniflowed.uf"] }

3. What VS Code still does itself

With validation off, VS Code's service still answers hover, go to definition and suggestions in JavaScript, beside uf's answers. VS Code has no setting that turns those off for JavaScript alone. Two options:

• Leave them. Hover shows both answers, and go to definition may offer two targets.
• Turn the service off for the workspace. In the Extensions view, search @builtin TypeScript, open TypeScript and JavaScript Language Features, and choose Disable (Workspace). That stops it for every file in this workspace, .ts included, which suits a Flow-only project. VS Code keeps that choice in its own workspace storage, not in a file, so each person makes it once.

To keep VS Code's suggestions out of JavaScript while leaving its hover, add "javascript.suggest.enabled": false and, in "[javascript]", "js/ts.suggest.enabled": false.

4. Check that it worked

1. Open a file that uses component or match. The Problems panel lists only entries whose source is uf or flow, with no ts(…) codes.
2. Hover a variable. uf's hover shows the type as Flow infers it (const first: Flag).
3. Run Format Document, then uf fmt --check in a terminal. If the terminal reports the file, the server read a different configuration. Open the folder that holds uf.config.js.
4. The status bar item on the right shows uf with the version it is running. Click it for the log and a restart.

A TypeScript project in the same editor

Nothing above leaves the project. The settings live in its .vscode/, and the extension starts no server and writes no settings in a folder without uf.config.js.

A multi-root workspace is the one case to know about. VS Code treats javascript.validate.enable as window-scoped there, so it cannot be set for one folder. The extension skips it rather than write it to the .code-workspace file, which would turn validation off for a TypeScript folder next to the uf one. On VS Code 1.110 and later, js/ts.validate.enabled is set per folder and does the job. On older versions the uf folder keeps TypeScript's errors in a multi-root window.

Checked against

The setting names, their scopes and the "[javascript]" behaviour were read from VS Code's typescript-language-features source (1.110) and its release notes in September 2026. The Cursor behaviour comes from Cursor's changelog (extension API 1.105.1) and has not been checked in a running Cursor. No VS Code runs in this repository's CI. The extension's own decisions are tested without one, as editors/vscode describes.

Edit this pagedocs/app/guide/editors/vscode/$page.mdx