Flow
Flow(英語) は、JavaScript(英語) に型アノテーションをもたらす静的型チェッカーです。IntelliJ IDEA は Flow 構造を認識し、すべてのオペレーティングシステムでそれらの構文をハイライトします。
始める前に
Node.js(英語) をダウンロードしてインストールします。
Flow のインストールと構成
埋め込みターミナル(Alt+F12)で、以下のいずれかのコマンドを入力します。
npm install --global flow-bin
を使用して Flow をグローバルにインストールします。開発依存として Flow をインストールするための
npm install --save-dev flow-bin
Flow オフィシャル Web サイト(英語)の詳細を参照してください。
IntelliJ IDEA に Flow 構造を認識させ、正しい構文ハイライトを提供し、エラーを適切に報告し、誤検出エラーハイライトを回避し、プロジェクトの JavaScript 言語レベルを Flow に変更し、.flowconfig 構成ファイルをプロジェクトに追加し、上部に // @flow
コメントでチェックされています。
プロジェクトの言語レベルを Flow に変更する
設定 / 環境設定ダイアログ Ctrl+Alt+S で、 に移動します。JavaScript ページが開きます。
JavaScript 言語バージョンリストから Flow を選択します。
Flow パッケージまたは実行可能ファイルフィールドで、node_modules\flow-bin パッケージまたは Flow バイナリ実行可能ファイルへのパスを指定します。 node_modules\.bin\flow を使用するには、Node.js へのパスが
PATH
環境変数に追加されていることを確認してください。Flow サーバーを使用する : エリアで、次のチェックボックスをオンまたはオフにして、コーディング支援の基礎を指定します。
型チェック : このチェックボックスを選択すると、Flow サーバーから受信したデータに基づいて構文とエラーのハイライトが行われます。このチェックボックスをオフにすると、基本的な内部 IntelliJ IDEA ハイライトのみが使用可能になります。
ナビゲーション、コード補完、型ヒント : このチェックボックスを選択すると、参照解決とコード補完の候補リストには、Flow との統合から取得された候補と IntelliJ IDEA によって計算された候補の両方が含まれます。このチェックボックスをオフにすると、参照は IntelliJ IDEA 計算によってのみ解決されます。
Flow は他のすべての変更されたファイルが保存された後でのみ Flow が現在のファイルをチェックするため、Flow が継続的に適用されるように、変更したファイルをすべて自動的に保存するチェックボックスを選択したままにしておきます。
Flow を有効にする
.flowconfig を追加するには、埋め込みターミナル(Alt+F12)を開いて次を入力します。
flow init
.flowconfig を特定のフォルダーに追加するには、次を入力します。
cd <path to the folder to check>
flow init
ファイルで Flow を有効にするには、ファイルの上部に
// @flow
コメントを追加します。単にflow
と入力して Tab を押すと、IntelliJ IDEA が// @flow
に展開します。まだ .flowconfig を持っていない場合、IntelliJ IDEA は、現在のフォルダーに構成ファイルを追加するように促すツールチップを表示します。
現在のフォルダーとプロジェクトルートを選択するには、その他のアクションをクリックするか、Alt+Enter を押します。
監視エラー
IntelliJ IDEA では、Flow によって検出されたエラーを専用の Flow ツールウィンドウで表示できます。このツールウィンドウは、少なくとも 1 つの .flowconfig ファイルをプロジェクトに追加すると使用可能になります。ツールウィンドウを開くには、メインメニューから を選択します。
Flow ツールウィンドウは 2 つのペインで構成されています。
エラーペインには、アクティブなエディタータブで開かれているファイルで検出されたすべての不一致のリストが表示されます。上部にファイルへのフルパスが表示されます。
Flow ツールウィンドウを開くと、エラーペインのみが表示されます。
プロジェクトエラーペインは、ツールバーの
をクリックしてプロジェクト全体に対して Flow を実行した後、現在のプロジェクトのすべてのファイルで検出されたすべての不一致のリストを表示します。エラーメッセージは、検出されたファイルごとにグループ化されます。
ツールバー
ツールバーは、現在のエラーおよびプロジェクトエラーペインに共通です。
項目 | ツールチップ およびショートカット | 説明 |
---|---|---|
![]() | すべてのエラーを表示する | このボタンをクリックすると、プロジェクトエラーペインに切り替わり、現在のプロジェクトで検出されたすべての不一致が表示されます。 |
![]() | ヘルプ | このボタンを使用して、ツールウィンドウのヘルプトピックに移動します。 |
| 閉じる Ctrl+Shift+F4 | このボタンをクリックすると、Flow タイプチェッカーが終了し、ツールウィンドウが閉じます。 |
| すべて展開 Ctrl+NumPad + すべて折りたたむ Ctrl+NumPad - | これらのボタンを使用して、すべてのノードを展開または折りたたんでください。 |
| すべてを削除 | このボタンをクリックすると、現在アクティブなペインからすべてのエラーメッセージが削除されます。 |
コンテキストメニュー
コンテキストメニューは、エラーペインとプロジェクトエラーペインに共通です。
項目 | 説明 |
---|---|
ソースに移動 | 選択した問題が検出されたファイルを開き、エラーの原因となったコードの断片に移動するには、このオプションを選択します。 |
コピー | 選択したエラーメッセージを、エラーが発生したファイル、行、列の情報とともにコピーするには、このオプションを選択します。 |
関連ページ:

JavaScript
このページは、プラグインの管理で説明されている設定 / 環境設定 | プラグインページで JavaScript と Typescript プラグインが有効になっている場合にのみ使用できます。JavaScript 言語バージョンこのリストから、プロジェクトで使用する言語機能のセットを表す JavaScript 言語バージョンを選択します。利用可能なオプションは次のとおりです。ECMAScript 5.1、ECMAScript 6 以降: このバージョンでは、ECMAScript 2015-2020 で...

カバレッジで未使用のコードを見つける
IntelliJ IDEA を使用すると、クライアント側アプリケーションで未使用の JavaScript、TypeScript、CSS コードを見つけることができます。特別なコードカバレッジモードでアプリケーションを実行すると、IntelliJ IDEA は、すべてのファイルとフォルダーで使用されたコードの量を示すレポートを作成します。ソースマップのおかげで、このレポートにはソースファイルのカバレッジが表示されますが、ブラウザーで実際に実行されたコンパイル済みコードのカバレッジは表示されません。...