サーバー側とクライアント側のコードのデバッグ
JetBrains Rider を使用すると、Node.js アプリケーションのサーバー側コードとクライアント側 JavaScript コードを一緒にデバッグできます。そのためには、Node.js 構成に加えて、JavaScript デバッグ構成を作成して起動する必要があります。
JetBrains Rider を使用すると、メインの Node.js 構成を作成または編集するときに、ライブ編集タブから JavaScript デバッグ構成を作成できます。この場合、Node.js 構成を開始するたびに、JavaScript デバッグ構成が自動的に開始されます。
または、実行構成の編集ダイアログ ( ) から JavaScript デバッグ構成を作成し、構成を個別に起動します。
2 つの実行 / デバッグ構成を作成する
実行ウィジェットのリストから、JavaScript デバッグ構成と一緒に起動する Node.js 実行構成を選択します。次に、 をクリックし、メニューから編集を選択します。
または、Node.js 実行 / デバッグ構成を作成するの説明に従って、新しい Node.js 実行構成を作成します。
開いたダイアログには、選択した Node.js 実行 / デバッグ構成の設定が表示されます。ブラウザー / Live Edit タブに切り替えます。
ブラウザー / Live Edit タブで、デバッグセッションを起動したときにブラウザーを自動的に起動するには、起動後を選択します。下のフィールドに、アプリケーションを開く URL アドレスを入力します。
起動後チェックボックスの隣のリストから使用するブラウザーを選択してください。
システムデフォルトブラウザーを使用するには、デフォルトを選択します。
カスタムブラウザーを使用するには、リストからブラウザーを選択します。JavaScript クライアント側コードのデバッグは、Google Chrome(英語) およびその他の Chromium ベースのブラウザー(英語)でのみサポートされていることに注意してください。
ブラウザーを構成するには、 をクリックし、表示される Web ブラウザーとプレビューダイアログで設定を調整します。詳細については、「ブラウザーの構成」を参照してください。
JavaScript デバッガーを使用するチェックボックスを選択します。
サーバーとクライアントのコードをデバッグするためのセッションを開始する
実行ウィジェットのリストから、変更された Node.js 実行構成を選択し、その横にある をクリックします。
開いたデバッグツールウィンドウには、Node.js 実行 / デバッグ構成のタブと Javascript デバッグ実行 / デバッグ構成のタブの 2 つのタブがあります。どちらのタブがアクティブになるかは、最初のヒットブレークポイントの場所によって異なります。
デバッグセッションを続行します。ブレークポイントをステップ実行し、フレームを切り替え、オンザフライで値を変更し、中断されたプログラムを調べ、式を評価し、ウォッチを設定します。
ブラウザーが開いたら、コードの実行をトリガーする手順を実行します。例: アプリケーションの開始ページからブラウザー内の別のページに移動します。
クライアント側コードの最初のブレークポイントに到達すると、アプリケーションが停止し、ブラウザーのページが再読み込みされ、デバッグツールウィンドウのフォーカスが JavaScript デバッグ構成のタブに移動します。
デバッグセッションを続行します。ブレークポイントをステップ実行し、フレームを切り替え、オンザフライで値を変更し、中断されたプログラムを調べ、式を評価し、ウォッチを設定します。
関連ページ:
Node.js の実行とデバッグ
JetBrains Rider は、Node.js アプリケーションの実行とデバッグを支援します。JetBrains Rider から起動し、すでに実行中のアプリケーションにアタッチするアプリケーションをデバッグできます。始める前に:JavaScript と TypeScript、JavaScript デバッガー、Node.js に必要なプラグインが設定 | プラグインページのインストール済みタブで有効になっていることを確認します。詳細については、プラグインのマッピングを参照してください。Nod...
ブラウザーの構成
JetBrains Rider には、HTML ファイルの出力の実行、デバッグ、プレビュー中に IDE から自動的にインストールおよび起動できる最も一般的なブラウザーの事前定義リストが付属しています。JetBrains Rider は、標準の手順に従ってブラウザーをインストールすることを前提としており、各インストールに、ブラウザーの実行可能ファイルまたは macOS アプリケーションへのデフォルトパスを表すエイリアスを割り当てます。デフォルトリストのブラウザーに加えて、カスタムブラウザーのインス...
中断されたプログラムを調べる
フレームを分析することで、中断されたアプリケーションの状態を調べることができます。コードがデバッグモードで実行されている場合、それを一時停止するには 2 つの方法があります。検査するコード内のブレークポイントの設定で、いずれかがヒットするまで待機します。でプログラムの実行を中断します。デバッガーは、一時停止した瞬間に実行中のステートメントを終了し、次に実行する必要のあるステートメントで停止します。一時停止状態では、現在の実行ポイント(次に実行されるステートメント)は、エディターの左側のガターにあ...
マルチプロセスデバッグ
JetBrains Rider を使用すると、child_process.fork() メソッドまたはクラスターモジュールによって起動される追加の Node.js プロセスをデバッグできます。このようなプロセスは、デバッグツールウィンドウのデバッガータブのフレームペインにスレッドとして表示されます。デバッグするプロセスにブレークポイントを設定します。Node.js の実行とデバッグの説明に従って、Node.js 実行 / デバッグ構成を作成します。ツールバーの実行 / デバッグ構成を選択リストから、新...