RubyMine 2026.1 ヘルプ

JavaScript デバッガーの構成

RubyMine は、client-side JavaScript コード用の組み込みデバッガーを提供します。デバッグセッションを開始すると、ビルトインデバッガーが自動的に起動します。

デバッグが正常に行われるようにするには、組み込みの Web サーバーポートを指定して、RubyMine が他のデバッガーオプションに提案しているデフォルト設定を受け入れるだけで十分です。

始める前に

  1. 設定で JavaScript and TypeScript バンドルプラグインが有効になっていることを確認します。Ctrl+Alt+S を押して設定を開き、プラグインを選択します。インストール済みタブをクリックします。検索フィールドに JavaScript and TypeScript と入力します。プラグインの詳細については、プラグインのマッピングを参照してください。

  2. 設定で JavaScript Debugger バンドルプラグインが有効になっていることを確認します。Ctrl+Alt+S を押して設定を開き、プラグインを選択します。インストール済みタブをクリックします。検索フィールドに JavaScript Debugger と入力します。プラグインの詳細については、プラグインのマッピングを参照してください。

組み込みの Web サーバーポートを設定する

RubyMine には Web サーバーが内蔵されており、Web ブラウザーでアプリケーションをデバッグしたり、RubyMine の内蔵ブラウザーでコードをプレビューしたりできます。このサーバーは常に稼働しており、手動での設定は不要です。詳しくは組み込みサーバーで実行されているアプリケーションをデバッグするを参照してください。

  1. Ctrl+Alt+S を押して設定を開き、ツール | ウェブブラウザーとプレビューを選択します。

  2. ビルトインサーバーエリアで、組み込み Web サーバーが実行されるポートを指定します。デフォルトでは、このポートは、RubyMine がサービスからの接続を受け入れるデフォルトの RubyMine ポート 63342 に設定されます。ポート番号は 1024 から始まる他の値に設定できます。

    Built-in server port

デフォルトのデバッガー構成をカスタマイズする

呼び出しを抑制する

  1. Ctrl+Alt+S を押して設定を開き、ツール | ウェブブラウザーとプレビューに移動します。

  2. 外部接続を受け入れ可能または署名されていない要求を許可するのチェックボックスをそれぞれオフにして、他のコンピューターまたは RubyMine の外部からの組み込みサーバー上のファイルへの呼び出しを抑制します。

    Suppress external calls

ブレークポイントを削除する方法を選択する

デフォルトでは、マウスの左ボタンをクリックすることでブレークポイントを切り替えることができます。この動作を変更するには、以下の手順に従います。

  1. Ctrl+Alt+S を押して設定を開き、ビルド、実行、デプロイ | デバッガーに移動します。

  2. ブレークポイントの除去領域で、適切なオプションを選択します。

    Remove breakpoints

スキップするスクリプトを指定する

デフォルトでは、デバッガーはライブラリスクリプトにのみステップインしません。抑制リストを展開するには、次の手順を実行します。

  1. Ctrl+Alt+S を押して設定を開き、ビルド、実行、デプロイ | デバッガー | ステップに移動します。

  2. JavaScript 領域で、スクリプトにステップインしないチェックボックスを選択し、the Add buttonthe Remove button を使用してスキップする URL アドレスを追加します。

    JavaScript debugger: skip scripts

拡張オプション

  • Ctrl+Alt+S を押して設定を開き、ビルド、実行、デプロイ | デバッガー | データビューに移動します。

    インラインデバッグを有効または無効にしたり、オブジェクトの値や式の評価結果を含むツールヒントをいつ表示するかを指定したりします。

    JavaScript debugger: Data views
  • Ctrl+Alt+S を押して設定を開き、ビルド、実行、デプロイ | デバッガー | データビュー | JavaScript に移動します。

    オブジェクトプロパティをオブジェクトノードに表示するかどうかを指定します。表示する場合は、プロパティを指定します。プロパティのリストを管理するには、 を使用します。

    Properties to show on object nodes

推奨する Chrome ユーザーデータでデバッグセッションを開始する

デバッグセッションが、通常のウィンドウではなく、カスタム Chrome ユーザーデータ(英語)で新しいウィンドウで開始されることに気付くかもしれません。その結果、ウィンドウの見た目が通常と異なり、たとえばブックマーク、ブラウザー履歴、拡張機能が表示されず、開発エクスペリエンスが損なわれます。これは、RubyMine が Chrome デバッグプロトコル(英語)を使用し、Chrome を --remote-debugging-port オプションで実行するために発生します。ただし、Chrome がすでに起動している場合、同じユーザーデータディレクトリを持つ新規または既存の Chrome インスタンスに対してデバッグポートを開くことができません。そのため、RubyMine は常にカスタムユーザーデータディレクトリを持つ新しいウィンドウでデバッグセッションを開始します。

使い慣れたルックアンドフィールで新しい Chrome インスタンスを開くには、RubyMine で Chrome を構成して、ユーザーデータディレクトリから開始するようにします。

Custom Chrome user data

RubyMine で Chrome を設定して、推奨する Chrome ユーザーデータで起動する

  1. お好みの Chrome ユーザーデータ(英語)Chrome のデフォルトのユーザーデータディレクトリ(英語)とは異なる別のカスタムディレクトリ 形式でコンピューターに保存します。

    Chrome 136 以降はデフォルトのユーザーディレクトリでのデバッグをサポートしていないため、お好みのユーザーデータを別のカスタムディレクトリに保存する必要があります。詳しくは Chrome オフィシャル Web サイト(英語)を参照してください。

  2. Ctrl+Alt+S を押して設定を開き、ツール | ウェブブラウザーとプレビューを選択します。

  3. 新しい Chrome 構成を作成するには、Add をクリックします。新しい項目がリストに表示されます。パスフィールドに、Chrome インストールフォルダーへのパスを指定します。

  4. 新しい構成を選択し、編集ボタン (Edit) をクリックします。

  5. Chrome 設定ダイアログで、カスタムユーザーデータディレクトリを使用するチェックボックスを選択し、優先するユーザーデータを含むカスタムディレクトリへのパスを指定します。

    複数のユーザーデータプロファイル(英語)がある場合、それぞれが別々のサブディレクトリに保存されます。プロファイルを使用するには、コマンドラインオプションフィールドで以下のように指定します。

    --profile-directory="<profile_to_use>"
    Specify a custom profile subdirectory
  6. ウェブブラウザーに従って、Chrome ブラウザー構成のデフォルトをマークします。実行 / デバッグ構成の作成の場合は、ブラウザーリストから必要なブラウザーを選択することを忘れないでください。

2026 年 3 月 11 日

関連ページ:

Chrome での JavaScript のデバッグ

RubyMine は、client-sideJavaScript コード用の組み込みデバッガーを提供します。以下のビデオと手順では、このデバッガーの使用を開始するための基本的な手順を説明しています。始める前に:設定で JavaScript and TypeScript バンドルプラグインが有効になっていることを確認します。を押して設定を開き、を選択します。インストール済みタブをクリックします。検索フィールドに JavaScript and TypeScript と入力します。プラグインの詳細について...

プラグインのインストール

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

外部ツール

サードパーティのコマンドラインアプリケーションを外部ツールとして構成し、RubyMine から実行します。たとえば、ワークフローによっては、特定のスクリプト、コードジェネレーター、アナライザー、プリプロセッサーまたはポストプロセッサー、データベースユーティリティなどを実行する必要がある場合があります。RubyMine を外部ツールとして設定すると、専用のアクションが提供されます。このアクションは、メインメニューや特定のコンテキストメニューから実行したり、ショートカットを割り当てたり、特定の実行構...

対話型デバッガーコンソール

対話式のコンソールペインには、スタックトレースと、コードにログインしたすべてのものが表示されます(たとえば、を使用)。コンソールペインも read-eval-print ループ(REPL)なので、そこに JavaScript コードスニペットを実行して、現在デバッグしているページと対話できます。コンソールで JavaScript を実行する入力フィールドにでステートメントの入力を始めます。タイプするにつれて、RubyMine は完成のための異形を提案します。該当する明細を選択してを押します。Ru...

HTML、CSS、JavaScript でのライブ編集

ライブ編集機能を使用すると、HTML、CSS、JavaScript コードに加えた変更は、ページを再ロードせずにブラウザーにすぐに表示されます。ライブ編集は、HTML、CSS、JavaScript を含む、または生成する他のファイルタイプに対して機能します。Node.js アプリケーションのデバッグのときにライブ編集を使用することもできます。詳細については、「Node.js アプリケーションでのライブ編集」を参照してください。デフォルトでは、ライブ編集は HTML および CSS ファイルに対し...