# 流程

> For the complete documentation index, see [llms.txt](https://www.jetbrains.com/zh-cn/help/idea/llms.txt).

> **TL;DR**
> 必需插件  :
>
>
>
> `JavaScript 和 TypeScript`  -  插件与 IntelliJ IDEA 捆绑在一起，并默认启用。

[Flow](https://flow.org/) 是一种静态类型检查器，为  JavaScript  引入类型注解。 IntelliJ IDEA 识别  Flow  结构并在所有操作系统上为它们提供语法高亮显示。

## 开始之前

下载并安装 [Node.js](http://nodejs.org/#download)。

## 安装和配置 Flow

Procedure:

* 在你的命令行 shell 或嵌入的   终端  （ `Alt+F12` (Windows), `⌥ F12` (macOS), `⌥ F12` (IntelliJ IDEA Classic (macOS)), `⌘ ⌃ T` (macOS System Shortcuts), `Alt+F12` (XWin), `Alt+F12` (GNOME), `Alt+F12` (KDE), `Alt+F12` (Emacs), `Alt+F12` (Sublime Text), `⌥ F12` (Sublime Text (macOS)), `Ctrl+Alt+1` (Visual Studio), `⌘ ⌃ 1` (Visual Studio (macOS)), `Alt+F12` (NetBeans), `Alt+F12` (Eclipse), `⌥ F12` (Eclipse (macOS))）中，使用以下命令之一：

* 要全局安装 Flow，请运行： ```BASH npm install --global flow-bin ```

* 要将 Flow 安装为开发依赖项，请运行： ```BASH npm install --save-dev flow-bin ```

请从 [Flow 官方网站](https://flow.org/en/docs/install/) 获取更多信息。

为了让 IntelliJ IDEA 识别  Flow  结构、提供正确的语法高亮、正确报告错误并避免误报错误高亮，请将项目中的  JavaScript  语言级别更改为  Flow ，向项目添加一个  `.flowconfig`  配置文件，并在每个要检查的文件顶部添加一个  `// @flow`  注释。

Procedure: 将项目语言级别更改为 Flow

1. 在   设置   对话框（ `Ctrl+Alt+S` (Windows), `⌘ Comma` (macOS), `⌘ Comma` (IntelliJ IDEA Classic (macOS)), `⌘ Comma` (macOS System Shortcuts), `Ctrl+Alt+S` (XWin), `Ctrl+Alt+S` (GNOME), `Ctrl+Alt+S` (KDE), `Ctrl+Alt+S` (Emacs), `Ctrl+Alt+S` (Sublime Text), `⌘ Comma` (Sublime Text (macOS)), `Ctrl+Alt+S` (Visual Studio), `⌘ Comma` (Visual Studio (macOS)), `Ctrl+Alt+S` (NetBeans), `Ctrl+Alt+S` (Eclipse), `⌘ Comma` (Eclipse (macOS))），转到  `语言与框架 | JavaScript` 。 [JavaScript](settings-languages-javascript.html) 页打开。

2. 从   JavaScript 语言版本  列表中选择   流程  。

3. 在   Flow 包或可执行文件  字段中，指定  `node_modules\flow-bin` 包或 Flow 二进制可执行文件的路径。 要使用  `node_modules\.bin\flow` ，请确保将 Node.js 的路径添加到  `路径`  环境变量中。

4. 在   将 Flow 服务器用于：  区域中，通过选中或清除以下复选框来指定编码辅助的依据：

* 类型检查： 选中此复选框时，将根据从 Flow 服务器接收到的数据提供语法和错误高亮显示。 清除此复选框时，仅提供 IntelliJ IDEA 的基本内部高亮显示。

* 导航、代码补全和类型提示： 选中此复选框时，引用解析和代码补全的建议列表将同时包含从与 Flow 集成中检索的建议和由 IntelliJ IDEA 计算的建议。 当复选框被清除时，引用仅通过 IntelliJ IDEA 计算来解析。

仅在指定了到  Flow  可执行文件的路径时，这些复选框才可用。

5. 请保持   自动保存所有已修改的文件   复选框选中状态，以确保 Flow 可以持续应用，因为 Flow 仅在所有其他修改的文件保存之后才检查当前文件。

Procedure: 启用 Flow

1. 要添加  `.flowconfig` ，请打开你的命令行 shell 或嵌入的   终端  （ `Alt+F12` (Windows), `⌥ F12` (macOS), `⌥ F12` (IntelliJ IDEA Classic (macOS)), `⌘ ⌃ T` (macOS System Shortcuts), `Alt+F12` (XWin), `Alt+F12` (GNOME), `Alt+F12` (KDE), `Alt+F12` (Emacs), `Alt+F12` (Sublime Text), `⌥ F12` (Sublime Text (macOS)), `Ctrl+Alt+1` (Visual Studio), `⌘ ⌃ 1` (Visual Studio (macOS)), `Alt+F12` (NetBeans), `Alt+F12` (Eclipse), `⌥ F12` (Eclipse (macOS))）并输入：

`flow init`

要将  `.flowconfig` 添加到指定文件夹，请输入：

`cd <path to the folder to check>`

`flow init`

2. 要在文件中启用 Flow，请在文件顶部添加一个  `// @flow` 注释：只需键入  `flow` ，按下 `Tab` (Windows), `⇥` (macOS), `⇥` (IntelliJ IDEA Classic (macOS)), `⇥` (macOS System Shortcuts), `Tab` (XWin), `Tab` (GNOME), `Tab` (KDE), `Tab` (Emacs), `Tab` (Sublime Text), `⇥` (Sublime Text (macOS)), `Tab` (Visual Studio), `⇥` (Visual Studio (macOS)), `Tab` (NetBeans), `Tab` (Eclipse), `⇥` (Eclipse (macOS))，IntelliJ IDEA会将其扩展为  `// @flow` 。

如果您还没有  `.flowconfig` ，IntelliJ IDEA 将显示一个工具提示，提示您将配置文件添加到当前文件夹。

![工具提示：将 .flowconfig 添加到当前文件夹](https://resources.jetbrains.com/help/img/idea/2026.3/ws_add_flowconfig_tooltip_current_folder.png)

要在当前文件夹和项目根目录之间进行选择，请点击   更多操作  或按 `Alt+Enter` (Windows), `⌥ ⏎` (macOS), `⌥ ⏎` (IntelliJ IDEA Classic (macOS)), `⌥ ⏎` (macOS System Shortcuts), `Alt+Enter` (XWin), `Alt+Enter` (GNOME), `Alt+Enter` (KDE), `Alt+Enter` (Emacs), `Alt+Enter` (Sublime Text), `⌥ ⏎` (Sublime Text (macOS)), `Alt+Enter` (Visual Studio), `⌥ ⏎` (Visual Studio (macOS)), `Alt+Enter` (NetBeans), `Ctrl+1` (Eclipse), `⌘ 1` (Eclipse (macOS))。

![工具提示：更多操作](https://resources.jetbrains.com/help/img/idea/2026.3/ws_add_flowconfig_more_actions.png)

## 监控错误

IntelliJ IDEA 允许您在 [问题](problems-tool-window.html)工具窗口中查看 Flow 检测到的错误。 要打开工具窗口，请从主菜单中选择  `视图 | 工具窗口 | 问题`  或点击编辑器右上角的小部件。

![检查小部件](https://resources.jetbrains.com/help/img/idea/2026.3/inspection-widget.png)

工具窗口由两个窗格组成。

* 错误 窗格显示检测到的所有差异的列表，这些差异出现在活动编辑器选项卡中打开的文件中。 文件的全路径显示在顶部。 ![错误窗格](https://resources.jetbrains.com/help/img/idea/2026.3/ws_flow_errors_pane.png) 要了解有关错误的更多信息，请从其描述的上下文菜单中选择 显示错误详情 。 ![错误窗格：显示详细信息](https://resources.jetbrains.com/help/img/idea/2026.3/ws_flow_errors_pane_details.png)

* 项目错误 窗格显示当前项目中所有文件中检测到的所有差异列表。 错误消息按检测到它们的文件进行分组。 ![项目错误窗格](https://resources.jetbrains.com/help/img/idea/2026.3/ws_flow_project_errors_pane.png)

从 [文件和项目范围分析](file-and-project-wide-analysis.html) 和 [获取结果并修正问题](resolving-problems.html) 了解更多。

## See also

### 语言和框架特定指南

[JavaScript](javascript-specific-guidelines.html) [配置 JavaScript 库](configuring-javascript-libraries.html)

### 参考

[JavaScript](settings-languages-javascript.html)

### Web 资源

[Using Flow in WebStorm](https://blog.jetbrains.com/webstorm/2016/11/using-flow-in-webstorm/)

