WebStorm 2024.2 ヘルプ

インレイヒント

インレイヒントはエディターに表示され、コードに関する追加情報を提供して、読みやすく移動しやすくします。

インレイヒントを有効または無効にする

  • 設定ダイアログ (Ctrl+Alt+S) を開き、エディター | インレイヒントに移動し、インレイヒントのグループを展開して、非表示または表示するヒントの横にあるチェックボックスをオフにします。

  • エディターでヒントを右クリックし、特定の種類のヒントを無効にするか、このカテゴリのすべてのヒントを無効にするかを選択します。

コードビジョン

コードビジョンヒントは、シンボルの継承の数と使用箇所をエディターに表示し、誰がそれを作成したかを示し、新しいシンボルまたはコミットされていない変更を含むシンボルをマークします。

ヒントにカーソルを合わせると、リンクに変わります。リンクをクリックすると、クラスまたはインターフェースの使用箇所または実装に移動したり、バージョン管理のアノテーションを開くことができます。

  • 継承は、クラスまたはインターフェースの子孫の数を示します。ヒントをクリックすると、子孫に移動します。複数の実装がある場合は、リストから関連するものを選択します。実装に移動から詳細を参照してください。

    Inlay hints, code vision: jump to an inheritor

    デフォルトでは、継承ヒントは有効になっています。無効にするには、チェックボックスをオフにします。

    または、エディターでヒントにカーソルを合わせ、コンテキストメニューからコードビジョンを隠す: 継承のインレイヒントまたはすべての 'コードビジョン' インレイヒントの非表示を選択します。

    Hide Inheritors hints in the editor
  • 使用状況は、プロジェクトでクラスまたはメソッドが使用された回数を示します。ヒントをクリックして使用箇所に移動するか、リストから該当するものを選択します。プロジェクトの使用箇所を検索するから詳細を参照してください。

    Inlay hints, code vision: jump to usages

    使用箇所の検索宣言から使用箇所に移動も参照してください。

    デフォルトでは、使用箇所ヒントは有効になっています。無効にするには、設定 | エディター | インレイヒント | コードビジョン使用箇所チェックボックスをオフにします。

    または、エディターでヒントにカーソルを合わせ、コンテキストメニューからコードビジョンを隠す: 使い方のインレイヒントまたはすべての 'コードビジョン' インレイヒントの非表示を選択します。

    Disable Usages inlay hints in the editor
  • AI でドキュメントを生成する - このヒントをクリックすると、ドキュメント作成 AI アクションが呼び出されます。

  • コンポーネントの使用箇所は、Vue、Svelte、Astro ファイルに表示されます。ヒントをクリックすると、プロジェクト内の任意の場所で特定のコンポーネントの使用箇所をすばやく検索できます。

    Show Component Usages
  • コード作成者は、シンボルを最後に編集した人を示します。ヒントをクリックして、ガターで Git アノテーションを開きます。コード作成者を見つけるから詳細を参照してください。

    Inlay hints, code vision: code author

ダイアログの右側のペインで、インレイヒントのデフォルトの位置 (シンボルの上に表示するか、シンボルの右側に表示するか) を構成し、各位置に表示するインレイヒントの最大数を指定します。

Code vision: configure default settings

特定の種類のヒントのカスタム配置を構成することもできます。

Configure position for inlay hints in the Settings dialog

パラメーター名

関数およびメソッド呼び出しのパラメーターの名前を表示します。これらのヒントは、関数やメソッドに正しい引数を渡す際に役立ちます。

チェックボックスをオンまたはオフにして、特定の言語および構文のコンテキストでインレイヒントを有効または無効にします。右側のインタラクティブプレビューを使用して、結果が期待どおりかどうかを確認します。

Inlay hints: parameter names

多くのメソッドと関数では、パラメーター名はデフォルトでは表示されません。そのようなメソッドと関数はデフォルトの除外リストにあります。除外されたパラメーター名のヒントを再度有効にするか、除外されるメソッドまたは関数をさらに追加するには、除外リストをクリックしてリストを編集します。

JavaScript のパラメーターヒントTypeScript のパラメーターのヒントの詳細を参照してください。

タイプ

エディターに変数、フィールド、パラメーター、関数の戻り値の型を表示します。

チェックボックスをオンまたはオフにして、特定の言語および構文のコンテキストでインレイヒントを有効または無効にします。右側のインタラクティブプレビューを使用して、結果が期待どおりかどうかを確認します。

Inlay hints: types

JavaScript の戻り値の型JavaScript の型ヒントTypeScript で型ヒントを返すTypeScript の型ヒントから詳細を参照してください。

デフォルトでは、このチェックボックスが選択されており、WebStorm は TypeScript コンテキストの数値列挙型(英語)の推定値を表示します。チェックボックスをオフにすると、推測された値が非表示になり、明示的に初期化された定数の値のみが表示されます。

メソッドチェーン

メソッドチェーン内の各メソッドの戻り値の型を表示します。ヒントは、メソッドが別の行で呼び出された場合にのみ表示されます。

その他

  • Docker は名前付きステージを実行します : Dockerfile で特定の名前付きステージをすばやくビルドまたは実行するためのアイコンを表示します。

  • テーブルインレイ : テーブルの周囲に水平バーと垂直バーを表示します。列と行のアクションを提供します。

インレイヒントの無効化

  • 設定ダイアログ (Ctrl+Alt+S) を開き、エディター | インレイヒントに移動し、インレイヒントのグループを展開して、非表示にするヒントの横にあるチェックボックスをオフにします。

  • エディターでヒントにカーソルを合わせ、コンテキストメニューからコードビジョンを隠す: 使い方のインレイヒントまたはすべての 'コードビジョン' インレイヒントの非表示を選択します。

    Disable Usages inlay hints in the editor

インレイヒントの外観を変更する

  1. 設定ダイアログ (Ctrl+Alt+S) で、エディター | カラースキームの切り替え | 言語のデフォルトに移動し、インラインヒントを選択します。

  2. インレイヒントのタイプと状態を選択し、必要に応じてフォントの色と効果を構成します。

関連ページ:

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

プラグインは WebStorm のコア機能を拡張します。例: プラグインをインストールして、次の機能を取得します。バージョン管理システム、課題追跡システム、ビルド管理サーバー、その他のツールとの統合。さまざまな言語とフレームワークのコーディング支援サポート。ショートカットのヒント、ライブプレビュー、ファイルウォッチャーなど。新しいプログラミング言語を学ぶのに役立つコーディング演習。デフォルトでは、WebStorm には多数のプラグインがバンドルされています。バンドルされたプラグインを無効にするこ...

ソースコードナビゲーション

さまざまなアクションやポップアップを使用して、エディター内のコードをすばやく移動することができます。エディターウィンドウとツールウィンドウ間の移動に関する詳細情報については、エディターの基本を確認してください。キャレットで移動する前のキャレット位置を見るには、メインメニューからを選択するか、を押します。前に進むには、を選択するかを押します。最後に編集した場所に移動するには、を押します。エディターで現在のキャレット位置を見つけるには、Ctrl+M を押します。大きなファイルをスクロールしたくな

使用箇所の検索

使用箇所の検索アクションを使用すると、コードベース全体でコード要素の参照を検索できます。検索プロセスを管理し、単一のファイルのみで検索したり、検索をプロジェクト全体に拡張したり、特定の検索範囲を作成したりできます。さらに、使用箇所のハイライトの色を構成したり、用途の自動ハイライトを完全に無効にしたりできます。ファイル内の使用箇所を検索するエディターで、検索するシンボルを選択すると、WebStorm はファイル内で見つかったすべての使用箇所を自動的にハイライトします。このハイライトをオフにするには...

AI でドキュメントを生成

AI Assistant を使用すると、LLM(大規模言語モデル)を使用して申告用のドキュメントを生成できます。コードフラグメントにキャレットを置き、右クリックしてコンテキストメニューを開きます。AI アクションを選択し、次にドキュメントを書くを選択します。AI Assistant がドキュメントを生成します。または、コンテキストメニューを使用する代わりに、と入力し、Enter を押して、AI Assistant で生成をクリックします。VCS コミット...

Git リポジトリの変更を調査する

WebStorm では、プロジェクト内のすべての変更を追跡できます。これにより、変更の作成者を特定し、ファイルバージョンまたはコミットの違いを確認し、必要に応じて変更を安全にロールバックして元に戻すことができます。プロジェクト履歴を確認する:指定したフィルターに一致するプロジェクトソースに加えられたすべての変更を確認できます。プロジェクト履歴を表示するには、Git ツールウィンドウのログタブを開きます。すべてのブランチおよびリモートリポジトリにコミットされたすべての変更が表示されます。マルチリ...

JavaScript

WebStorm を使用すると、JavaScript および Node.js を使用して最新の Web、モバイル、デスクトップアプリケーションを開発できます。WebStorm は、React、Angular、Vue.js、その他のフレームワークもサポートし、Web 開発用のさまざまなツールとの緊密な統合を提供します。JavaScript 対応のコーディング支援には、キーワード、ラベル、変数、パラメーター、関数の補完、エラーと構文のハイライト、フォーマット、コードインスペクションおよびクイックフィックス...