/flow-for-vscode

Flow for Visual Studio Code

Primary LanguageJavaScriptOtherNOASSERTION

Flow for Visual Studio Code

Backers on Open Collective Sponsors on Open Collective

This extension adds Flow support for VS Code. Flow is a static type checker, designed to find type errors in JavaScript programs. Follow the official guide to get started.

Want to help make Flow in VS Code really shine? We're looking for help on moving to the new flow-language-server support in flow. This means the flow core team would add features, and this extension will get them for almost free. If this is you, you can get set up for development easily.

Installation

Search for "flow" in the VS Code extensions panel or install through the marketplace.

Setup

  • Make sure you have a .flowconfig file in your workspace.
  • Make sure you are able to run the flow command from the command line (or see Configuration to customize the command or use NPM packaged flow).
  • Set javascript.validate.enable option to false or completely disable the built-in TypeScript extension for your project (see gif below):

Configuration

You can specify a configuration by amending the VS Code settings.json file. Access this through Preferences → Settings. You must reload VS Code after installing this extension for these settings to take affect.

  • flow.pathToFlow (default: 'flow') path to Flow that will be used for VSCode (eg; "${workspaceRoot}/node_modules/.bin/flow").
  • flow.stopFlowOnExit (default: true) stop flow server on exit from Project.
  • flow.enabled (default: true) you can disable flow for some Project for example.
  • flow.useNPMPackagedFlow (default: false) allows using flow from your node_modules for VSCode. WARNING: Setting to true is a security risk. When you open a project we will immediately run code contained within it.
  • flow.showStatus (default: true) If true will display a spinner in the status-bar while flow is type checking.
  • flow.showUncovered (default: false) If true will show uncovered code by default.
  • flow.runOnEdit (default: true) If true will run flow on every edit, otherwise will run only when changes are saved.
  • flow.runOnAllFiles (default: false) Run Flow on all files, No need to put //@flow comment on top of files.
  • flow.useLSP (default: false) Run Flow through Language Server Protocol [EXPERIMENTAL].

Features

  • IntelliSense
  • Go to Definition / Peek Definition
  • Diagnostics (Errors, Warnings)
  • Hover type information
  • Toggle-able Code Coverage reports

Known Issues

  • There are some aspects of Flow syntax which are not supported by the default VS Code JavaScript grammar, if you're having problems with syntax try JavaScript Atom Grammar.

Debugger configuration

First, follow the instructions to setup your launch configuration file, launch.json.

To use flow-remove-types:

  • Follow the flow-remove-type Quick Start.
  • In launch.json, add "runtimeArgs": ["-r", "flow-remove-types/register"] to the "launch" configuration.

To use Babel:

  • Follow the Babel Quick Start.
  • Install babel-register.
  • In .babelrc, add "retainLines": true.
  • In launch.json, add "runtimeArgs": ["-r", "babel-register"] to the "launch" configuration.

About

This plugin is built on top of Nuclide's Flow support.

Contributing

Contributors

This project exists thanks to all the people who contribute. [Contribute].

Backers

Thank you to all our backers! 🙏 [Become a backer]

Sponsors

Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor]

License

See here