WebStorm 2025.3 ヘルプ

カバレッジで未使用のコードを見つける

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

コードカバレッジモードでアプリケーションを実行する

  1. タイプ JavaScript デバッグの実行 / デバッグ構成を作成します。

    メインメニューの実行 | 実行構成の編集に移動します。開いた実行構成の編集ダイアログで、ツールバーの追加ボタン (the Add button) をクリックし、リストから JavaScript デバッグを選択します。開いた実行 / デバッグ構成: JavaScript デバッグダイアログで、アプリケーションが実行されている URL アドレスを指定します。この URL はブラウザーのアドレスバーからコピーできます。

    Coverage: run/debug configuration, specify URL
  2. ツールバーの実行 / デバッグ構成を選択リストで新しく作成した構成を選択し、リストの横にあるカバレッジ付き実行ボタン (the Run with Coverage button) をクリックします。

    Start app with coverage

    実行構成で指定された URL アドレスがブラウザーで開きます。

  3. ページのロード中に実行されたコードを知るには、アプリケーションをロードしてから、ツールバーの停止ボタン (the Stop button)、カバレッジ付きで '' を実行ボタン (the Run with Coverage button) の横、または実行ツールウィンドウをクリックしてアプリケーションを停止します。アプリケーションの特定の機能のカバレッジレポートが必要な場合は、ブラウザーでこれらの機能をトリガーしてから、停止ボタン (the Stop button) をクリックしてアプリケーションを停止します。

  4. カバレッジツールウィンドウでレポートを表示します。プロジェクトツールウィンドウ Alt+1 には、ファイルとフォルダーのカバレッジに関する情報が表示されます。エディターでは、実行された行の横に緑色のマーカーが表示され、実行されなかった行の横に赤色のマーカーが表示されます。行マーカーの上にマウスカーソルを合わせると、各コード行がヒットされた回数を確認することもできます。

    Coverage report
2025 年 9 月 08 日