実行 / デバッグ構成: Jest
作成:
このダイアログでは、 Jest(英語) テストを実行するための構成を作成します。 JavaScript および TypeScript コードの Vitest テストの作成の詳細については、Vitest 公式 Web サイトの Vitest の機能(英語) を参照してください。
始める前に Node.js をダウンロードしてインストールします。
設定で JavaScript and TypeScript プラグインが有効になっていることを確認します。 Ctrl+Alt+S を押して設定を開き、 を選択します。 インストール済み タブをクリックします。 検索フィールドに JavaScript and TypeScript と入力します。 プラグインの詳細については、 プラグイン管理 を参照してください。
Jest 固有の構成設定 項目
説明
構成ファイル
このフィールドで、使用する jest.config.js または jest.config.ts ファイルを指定します。リストから該当ファイルを選択するか、 をクリックして開いたダイアログで選択するか、フィールドにパスを直接入力してください。
フィールドが空の場合、PhpStormは jest キーを持つ package.json ファイルを探します。 検索は、 作業ディレクトリ から上に向かってファイルシステムで実行されます。 適切な package.json ファイルが見つからない場合、 Jest のデフォルト設定(英語) がオンザフライで生成されます。
ノードランタイム
このフィールドでは、使用する Node.js ランタイムを指定します。
プロジェクト エイリアスを選択すると、PhpStorm は JavaScript ランタイム ページの ノードランタイム フィールドにあるプロジェクトのデフォルトインタープリターを自動的に使用します。 ほとんどの場合、PhpStorm はプロジェクトのデフォルトランタイムを検出してフィールドへ自動入力します。
別の構成済みのローカルインタープリターまたはリモートインタープリターを選択するか、 をクリックして新しいインタープリターを構成することもできます。
ノード オプション
このフィールドに、Node.js 実行可能ファイルに渡す Node.js 固有のコマンドラインオプションを入力します。 許容されるオプションは次のとおりです。
実行中に CoffeeScript ファイルをオンザフライで JavaScript にコンパイルするには、 --require coffeescript/register を使用します。
このモードでは、 coffeescript パッケージの一部である register.js ファイルがプロジェクト内に配置されている必要があります。 CoffeeScript コンパイラーをインストール の説明に従って、 coffeescript パッケージがローカルにインストールされていることを確認してください。
Chrome デバッグプロトコル(英語) サポートには --インスペクション または --inspect-brk パラメーターを使用します。
プロジェクトで ECMAScript モジュール(英語) を使用するには、 —experimental-vm-modules フラグを ノード オプション フィールドに追加します。
Jest パッケージ
このフィールドで、 jest 、 react-scripts 、 react-script-ts 、 react-super-scripts 、 react-awesome-scripts パッケージの場所を指定します。
作業ディレクトリ
このフィールドでは、アプリケーションの作業ディレクトリを指定します。 デフォルトでは、 作業ディレクトリ フィールドにはプロジェクトのルートフォルダーが表示されます。 この事前定義された設定を変更するには、目的のフォルダーへのパスを指定してください。
Jest オプション
このフィールドに、Jest に渡す Jest CLI オプション(英語) を入力します。 例: 自動テストのようなランナー をオンにするために --watch フラグを追加します。 その結果、 再実行 ボタン をクリックせずに、関連するソースコードを変更すると、現在の実行構成のテストが自動的に再開されます。
環境変数
このフィールドには、オプションでコマンドを実行するための環境変数を指定します。 PhpStormは、これらの変数を process.env の補完リストに表示します。
テスト
この領域に、実行するテストを指定します。 利用可能なオプションは次のとおりです:
すべてのテスト: : jest.config.js または jest.config.ts 構成ファイル、または生成された Jest のデフォルト設定(英語) からすべてのテストを実行するには、このオプションを選択します。 デフォルトの構成では、テストは testRegex プロパティ(英語) のデフォルト値によって認識されます。
テストファイル: : 1 つのファイルからテストのみを実行し、 テストファイル フィールドにこのファイルへのパスを指定するには、このオプションを選択してください。
スイート: : このオプションを選択して、テストファイルから個々のスイートを実行し、 テストファイル フィールドにこのファイルへのパスを指定します。 スイート名 フィールドで をクリックし、 ボタンと ボタンを使用して実行するスイートのリストを構成します。
テスト: : このオプションを選択して、テストファイルから個々のテストを実行し、 テストファイル フィールドにこのファイルへのパスを指定します。 テスト名 フィールドで をクリックし、 および ボタンを使用して実行するテストのリストを構成します。
Docker コンテナーの設定
この読み取り専用フィールドには、ポートとボリュームのバインディングが表示されます。 をクリックして、コマンドプレビューを開きます。
Docker Compose
この領域では、Docker Compose に渡すコマンドとオプションを指定します。 デフォルト設定を受け入れるか、「 」をクリックしてカスタム設定 (たとえば、 --rm や --service-ports などのカスタム Docker Compose フラグ) を指定します。 詳細については、 Docker オフィシャル Web サイト(英語) を参照してください。
コマンドプレビュー を確認してください。
共通設定 実行構成を編集する場合(実行構成テンプレートではなく)、以下のオプションを指定できます:
項目
説明
命名
実行構成の名前を指定して、編集または実行時に他の構成の間ですばやく識別できるようにします。
プロジェクトファイルとして保存
実行構成設定を含むファイルを保存して、他のチームメンバーと共有します。 デフォルトの場所は .idea/runConfigurations です。 ただし、 .idea ディレクトリを共有したくない場合は、プロジェクト内の他のディレクトリに構成を保存できます。
デフォルトでは無効になっており、PhpStorm は実行構成設定を .idea/workspace.xml に保存します。
実行 / デバッグ構成のツリービューには、プロジェクト で利用できる構成の管理や、デフォルトの構成テンプレートの調整に役立つツールバーがあります。
項目
ショートカット
説明
Alt+Insert
実行 / デバッグ構成を作成します。
Alt+Delete
選択した実行 / デバッグ構成を削除します。 デフォルト設定は削除できません。
Ctrl+D
選択した実行 / デバッグ構成のコピーを作成します。 デフォルト設定のコピーを作成してください。
このボタンは、 一時的な構成 を選択した場合にのみ表示されます。 このボタンをクリックして、一時的な構成を永続的なものとして保存します。
新しいフォルダーに移動 / 新しいフォルダーを作成します。 実行 / デバッグ構成は、 フォルダーに配置 することでグループ化できます。
フォルダーを作成するには、カテゴリ内の設定を選択し、 をクリックしてフォルダー名を指定します。 カテゴリだけにフォーカスがある場合は、空のフォルダーが作成されます。
次に、設定をフォルダー内、フォルダー間、フォルダー外に移動するには、ドラッグまたは ボタンと ボタンを使用します。
グループ化を解除するには、フォルダーを選択して をクリックします。
このボタンをクリックすると、設定がアルファベット順にソートされます。
起動前 この領域では、選択した実行 / デバッグ構成を開始する前に実行するタスクを指定できます。 タスクは、リストに表示されている順序で実行されます。
項目
ショートカット
説明
Alt+Insert
このアイコンをクリックして、以下の利用可能なタスクのいずれかを追加します:
Web ブラウザーの起動 : ブラウザーを起動するには、このオプションを選択します。 開いたダイアログで、ブラウザーの種類を選択し、開始 URL を指定します。 また、ブラウザーを JavaScript デバッガーで起動するかどうかを指定します。
外部ツールの実行 : 外部アプリケーションを実行することを選択します。 開いたダイアログで、実行する 1 つまたは複数のアプリケーションを選択します。 PhpStorm でまだ定義されていない場合は、定義を追加します。 詳細については、 外部ツール および 外部ツール を参照してください。
別の構成を実行 : 別の実行 / デバッグ構成を実行することを選択し、それが完了するまで待ってから現在の構成を開始します。 複数の構成を並行して実行する場合は、 複合実行 / デバッグ構成 を使用してください。
ファイル監視の実行 :PhpStorm に現在アクティブな File Watchers をすべて適用するには、このオプションを選択します。
リモート外部ツールの実行 : リモート SSH 外部ツール を追加します。
Grunt タスクを実行 : Grunt タスクを実行するには、このオプションを選択してください。
表示される Grunt タスク ダイアログで、必要なタスクが定義されている Gruntfile.js を指定し、実行するタスクを選択して、Grunt ツールに渡す引数を指定します。
Node.js ランタイムの場所、それに渡すパラメーター、 grunt-cli パッケージへのパスを指定します。
Gulp タスクの実行 : Gulp タスクを実行するには、このオプションを選択してください。
表示される Gulp タスク ダイアログで、必要なタスクが定義されている Gulpfile.js を指定し、実行するタスクを選択して、Gulp ツールに渡す引数を指定します。
Node.js ランタイムの場所、それに渡すパラメーター、 gulp パッケージへのパスを指定します。
npm スクリプトを実行 : npm スクリプトを実行するには、このオプションを選択してください。
開いた NPM スクリプト ダイアログで、 npm 実行 / デバッグ構成設定 を指定します。
TypeScript のコンパイル : 組み込み TypeScript コンパイラーを実行するように選択し、TypeScript コードに加えたすべての変更が生成された JavaScript ファイルに反映されるようにします。 表示される TypeScript のコンパイル設定 ダイアログで、 エラーの確認 チェックボックスを選択または選択解除して、エラーが検出された場合のコンパイラーの動作を設定します。
CoffeeScript ソースマップの生成 : CoffeeScript ソースのソースマップを生成するには、このオプションを選択してください。 表示されるダイアログで、CoffeeScript のソースファイルがある場所を指定します。
Alt+Delete
このアイコンをクリックして、選択したタスクをリストから削除します。
Enter
選択したタスクを編集するには、このアイコンをクリックします。 開いたダイアログで必要な変更を加えます。
Alt+Up
Alt+Down
これらのアイコンをクリックして、選択したタスクをリスト内で 1 行上または下に移動します。 タスクは、リストに表示されている順に実行されます。
このページを表示する
実行 / デバッグ構成を実際に開始する前に、実行 / デバッグ構成設定を表示するには、このチェックボックスを選択します。
ツールウィンドウをアクティブにする
デフォルトではこのチェックボックスは選択されており、実行 / デバッグ構成を開始すると 実行 または デバッグ ツールウィンドウが開きます。
それ以外の場合、チェックボックスがオフの場合、ツールウィンドウは非表示になります。 ただし、構成が実行されている場合は、 Alt+4 または Alt+5 を押すことにより、構成に対応するツールウィンドウを自分で開くことができます。
2026 年 5 月 22 日