Flow
PhpStorm provides basic support of Flow static type checker that brings type annotations to JavaScript. This support involves recognition and syntax highlighting of Flow structures on all operating systems.
Before you start
- Download and install the Node.js runtime environment.
- Configure the Node.js interpreter in PhpStorm as described in Configuring a local Node.js interpreter.
- Make sure the Node.js plugin is enabled. The plugin is activated by default. If the plugin is disabled, enable it on the Plugins settings page as described in Enabling and Disabling Plugins.
Installing Flow
Open the built-in PhpStorm Terminal (Alt+F12) and at the command prompt, type:
-
npm install --global flow-bin
to install Flow globally. -
npm install --save-dev flow-bin
to install Flow in the current project.
Configuring Flow in PhpStorm
To have PhpStorm recognize Flow structures, provide correct syntax highlighting, report errors properly, and avoid false-positive error highlighting, change the JavaScript language level to Flow, add a .flowconfig
configuration file to your project, and supply every file to be checked with a // @flow
comment on top.
To change the language level to Flow
- In the Settings/Preferences dialog (Ctrl+Alt+S), click JavaScript under Languages and Frameworks. The JavaScript page opens.
- From the JavaScript Language Version drop-down list, choose Flow.
- In the Flow package or executable field, specify the path to the
node_modules\flow-bin
package or the Flow binary executable file. To usenode_modules\.bin\flow
make sure the path to Node.js is added to thePATH
environment variable. - In the Use Flow server for: area, specify the basis for coding assistance by selecting or clearing the following checkboxes:
- Type checking: When this checkbox is selected, syntax and error highlighting is provided based on the data received from the Flow server. When the checkbox is cleared, only the basic internal PhpStorm highlighting is available.
- Navigation, code completion, and type hinting: When this checkbox is selected, suggestion lists for reference resolution and code completiong contain both suggestions retrieved from integration with Flow and suggestions calculated by PhpStorm. When the checkbox is cleared, references are resolved through PhpStorm calculation only.
- Keep the Save all modified files automatically checkbox selected to ensure that Flow is applied continuously because Flow checks the current files only after all the other modified files are saved.
To generate a .flowconfig configuration file in your project
open the embedded Terminal ( ) and type flow init
at the command prompt.
To have a file checked with Flow
Add a // @flow
comment at the top of it: just type flow
, press Tab, and PhpStorm will expand it into // @flow
.