Node.js と Vagrant
Vagrant(英語) を使用すると、Node.js アプリケーションをすばやくブートストラップして、PhpStorm から実行、デバッグ、プロファイリングできます。
始める前に
設定 | プラグインページのインストール済みタブで、JavaScript and TypeScript、JavaScript Debugger、Node.js、Node.js リモートインタープリターの必須プラグインが有効になっていることを確認します。詳細については、プラグインのマッピングを参照してください。
JetBrains マーケットプレイスからプラグインをインストールする説明に従って、設定 | プラグインページのマーケットプレースタブに Vagrant プラグインをインストールして有効にします。
Vagrant(英語) と Oracle の VirtualBox(英語) がコンピューターにダウンロード、インストール、構成されていることを確認してください。詳細については、Vagrant を参照してください。
次の実行可能ファイルの親フォルダーがシステム PATH 変数に追加されていることを確認します。
Vagrant から vagrant.bat または vagrant を選択してください。これは、Vagrant インストーラによって自動的に実行されます。
Oracle VirtualBox インストールからの VBoxManage.exe または VBoxManage。
Vagrant 環境で Node.js を実行可能にするには、すぐに使用できる Vagrant ボックス(jandir/nodejs(英語) など)から始めることができます。
埋め込まれたターミナル(Alt+F12)を開き、次のコマンドを実行します。
vagrant init jandir/nodejs vagrant up
Vagrant 環境で Node.js インタープリターを構成する
Vagrant 環境の Node.js インタープリターは、Node.js リモートインタープリターの構成ダイアログで構成されます。このダイアログは、Vagrant でアプリケーションを実行またはデバッグするために Node.js の実行 / デバッグ構成を作成または編集するを実行するときに、設定ダイアログの Node.js ページ以降から開くことができます。
推奨される方法は、設定ダイアログでリモート Node.js インタープリターを構成することです。この場合、プロジェクトのデフォルトとしてインタープリターと関連するパッケージマネージャーを設定できます。
Node.js の実行 / デバッグ構成で直接構成するリモート Node.js インタープリターは、この実行 / デバッグ構成でのみ使用できます。
設定ダイアログ(Ctrl+Alt+S)を開き、 に移動します。
Node インタープリターフィールドの横にある
をクリックします。
現在構成されているすべてのインタープリターのリストが表示された Node.js インタープリターダイアログで、ツールバーの
をクリックし、コンテキストメニューからリモートの追加を選択します。
開いた Node.js リモートインタープリターの構成ダイアログで、Vagrant を選択します。
使用する環境を指す Vagrant インスタンスフォルダーを指定してください。
技術的には、目的の環境の VagrantFile 構成ファイルが配置されているフォルダーです。この設定に基づいて、PhpStorm は Vagrant ホストを検出し、Vagrant ホスト URL 読み取り専用フィールドにリンクとして表示します。
デフォルトでは、フィールドには現在のプロジェクトフォルダーが表示されます。
Node.js インタープリターのパスフィールドで、Node.js 実行可能ファイルの場所を指定します。
Node.js 実行可能ファイルを見つけるには、埋め込みターミナル(Alt+F12)を開いて次のように入力します。
vagrant ssh whereis node exitOK をクリックして、新しいインタープリターがリストに追加される Node.js インタープリターダイアログに戻ります。
新しく構成されたインタープリターをプロジェクトのデフォルトとして設定するには、リストでインタープリターを選択し、OK をクリックして Node.js ダイアログに戻ります。
PhpStorm は、たとえば実行 / デバッグ構成を作成するときに、Node インタープリターリストから
Project
エイリアスを選択するたびに、このインタープリターを自動的に使用します。使用するパッケージマネージャーへのパスを指定します。
パッケージマネージャーを見つけるには、組み込みターミナル(Alt+F12)を開いて次のように入力します。
vagrant ssh whereis <package manager> exit
Node.js 実行 / デバッグ構成を作成する
構成の編集ダイアログで、ツールバーの
に進みます。開いたをクリックし、コンテキストメニューから Node.js を選択します。「実行 / デバッグ構成: Node.js」ダイアログが開きます。
ファイルフィールドで、アプリケーションを開始するファイルへのパスを指定します。
必要に応じて、Node.js アプリケーションの実行とデバッグで説明されているいくつかのオプション設定を指定します。
Node インタープリターリストから、Vagrant 環境で関連するリモート Node.js インタープリターを選択します。
または、Node インタープリターフィールドの横にある
をクリックします。Node.js インタープリターダイアログが開きます。
ツールバーの
をクリックし、コンテキストメニューからリモートの追加を選択します。
上記のように、Vagrant 環境でリモート Node.js インタープリターを構成します。
実行 / デバッグ構成を保存するには、OK をクリックします。
Vagrant 環境で Node.js アプリケーションを実行する
ツールバーの実行 / デバッグ構成ウィジェットリストから、新しく作成した Node.js 構成を選択し、その横にある
をクリックします。
あるいは、上記のように Vagrant 環境で Node.js インタープリターを使用して Node.js 実行 / デバッグ構成を作成するか、既存のものを変更してダイアログで実行をクリックします。
アプリケーションの出力を確認する
アプリケーションが期待どおりに機能することを確認するために、PhpStorm 組み込みの HTTP クライアントから HTTP リクエストを実行できます。

HTTP リクエストファイルを作成します。
次のリクエストを書いてください。
GET http://<host IP>:<application port>/デフォルトでは、ホスト IP は 192.168.33.10 です。例:
GET http://192.168.33.10:3000/ガターの
をクリックし、Run http://<host IP>:<application port>/ の横にある
をクリックします。
アプリケーションの出力は、実行ツールウィンドウの別のタブに表示されます。
Vagrant 環境で Node.js アプリケーションをデバッグする
必要に応じて、コードにブレークポイントを設定します。
上記のように、Vagrant 環境で Node.js インタープリターを使用して Node.js 実行 / デバッグ構成を作成します。
ツールバーの実行ウィジェットリストから、新しく作成した Node.js 構成を選択し、その横にある
をクリックします。
開いたデバッグツールウィンドウで、デバッグセッションに進みます。ブレークポイントをステップスルーし、フレームを切り替え、オンザフライで値を変更し、中断されたプログラムを調べ、式を評価し、ウォッチを設定します。
関連ページ:

プラグインのインストール
プラグインは PhpStorm のコア機能を拡張します。例: プラグインをインストールして、次の機能を取得します。バージョン管理システム、課題追跡システム、ビルド管理サーバー、その他のツールとの統合。さまざまな言語とフレームワークのコーディング支援サポート。ショートカットのヒント、ライブプレビュー、ファイルウォッチャーなど。新しいプログラミング言語を学ぶのに役立つコーディング演習。プラグイン設定を開くを押して設定を開き、を選択します。マーケットプレースタブを使用して、JetBrains マーケッ...

Vagrant
Vagrant は、仮想マシンのライフサイクルを管理するために使用されるコマンドラインユーティリティです。PhpStorm は Vagrant と完全に統合されており、Vagrant 仮想環境を構成し、仮想マシンの動作を制御し、プロジェクト内から Vagrant コマンドを実行できます。Vagrant を使用する場合、次の定義が満たされます。Vagrantfile: Vagrant 環境を定義し、仮想ボックスのすべての構成を格納し、仮想マシンの操作方法を Vagrant に指示するメイン構成ファイ...

実行 / デバッグ構成: Node.js
作成: 次の Node.js バージョンは、PhpStorm 2023.3 以降でサポートされています。Node.js 20 - アクティブな長期サポート (LTS) バージョン、Node.js 21 - 現在のバージョン、サポートされている Node.js バージョンの詳細を参照してください。このダイアログで、コンピューター上の Node.js アプリケーションと一緒にデバッガーを開始するための構成を作成します。始める前に:Node.js をダウンロードしてインストールします。構成タブ:Nod...

Node.js の実行とデバッグ
PhpStorm は、Node.js アプリケーションの実行とデバッグを支援します。PhpStorm から起動し、すでに実行中のアプリケーションにアタッチするアプリケーションをデバッグできます。始める前に:JavaScript and TypeScript、JavaScript Debugger、Node.js に必要なプラグインが設定 | プラグインページのインストール済みタブで有効になっていることを確認します。詳細については、プラグインのマッピングを参照してください。Node.js アプリケ...

HTTP クライアント
HTTP クライアントプラグインを使用すると、PhpStorm コードエディターで HTTP リクエストを直接作成、編集、実行できます。HTTP リクエストを作成して実行する必要がある場合、主に 2 つのユースケースがあります。RESTful Web サービスを開発していて、それが期待どおりに機能し、仕様に準拠してアクセス可能であり、正しく応答することを確認したい場合。RESTful Web サービスに対応するアプリケーションを開発している場合。この場合、開発を開始する前にサービスへのアクセスと...

デバッグツールウィンドウ
デバッガーセッションを開始すると、デバッグツールウィンドウが開きます。このウィンドウを使用して、デバッガーセッションを制御し、プログラムデータ (フレーム、変数など) を表示および分析し、デバッガーアクションを実行します。デフォルトでは、プログラムがブレークポイントに到達したときにデバッグツールウィンドウが開き、セッションが終了しても非表示になりません。この動作を変更するには、ビルド、実行、デプロイ | デバッガー設定ページに移動し、ブレークポイントでデバッグウィンドウを表示するチェックボック...