VS Codeのエージェントモードを拡張するには、を試してください!

VS Codeでチャットを使用する

Visual Studio Codeでチャットを使用すると、コードベースについて質問したり、自然言語を使用してプロジェクト全体の編集を行ったりできます。チャットは、質問をする、複数ファイルの編集を行う、自律的なコーディングワークフローを開始するなど、ユースケースに最適化されたさまざまなモードで動作します。

次のような場合に、VS Codeでチャットを使用することをお勧めします。

  • コードの理解 - 「この認証ミドルウェアがどのように機能するか説明してください」
  • 問題のデバッグ - 「このループでnull参照が発生するのはなぜですか?」
  • コードの提案を取得 - 「Pythonで二分探索木を実装する方法を教えてください」
  • パフォーマンスの最適化 - 「このデータベースクエリの効率を改善するのを手伝ってください」
  • ベストプラクティスの学習 - 「非同期関数でエラーを処理する推奨される方法は何ですか?」
  • VS Codeのヒントを取得 - 「キーボードショートカットをカスタマイズするにはどうすればよいですか?」

前提条件

VS Codeでチャットにアクセスする

VS Codeでは、自然言語チャットをさまざまな方法で使用でき、それぞれが特定のユースケースとタスクに最適化されています。

エクスペリエンス ユースケース ユーザーエクスペリエンス
チャットビュー
⌃⌘I (Windows, Linux Ctrl+Alt+I)
専用のサイドビューで、継続的な複数ターンのチャット会話を行います。異なるチャットモードを切り替えて、質問をしたり、ファイル間でコード編集を行ったり、自律的なコーディングワークフローを開始したりできます。 Screenshot of the Chat view
インラインチャット
⌘I (Windows, Linux Ctrl+I)
エディター(エディターインラインチャット)または統合ターミナル(ターミナルインラインチャット)から直接チャット会話を開始し、その場で提案を得ます。 Screenshot of the Inline chat
クイックチャット
⇧⌥⌘L (Windows, Linux Ctrl+Shift+Alt+L)
簡単な質問をして、元の作業に戻ります。 Screenshot of the Quick Chat

各チャットエクスペリエンスには、対応するキーボードショートカットを使用するか、VS CodeタイトルバーのCopilotメニューからアクセスできます。

Screenshot of the Copilot Chat menu in the VS Code Command Center

チャットモードを選択する

チャットモードは、質問、コード編集、自律的なコーディングタスクなど、特定のタスクのためにVS Codeのチャットをカスタマイズするための事前定義された構成です。VS Codeには、AskEditAgentの3つの組み込みチャットモードが付属しています。また、新機能の計画や実装オプションの調査など、特定のシナリオ用に独自のチャットモードを定義することもできます。

チャットモードを切り替えるには、チャットビューを開き(⌃⌘I (Windows, Linux Ctrl+Alt+I))、チャットモードのドロップダウンリストから目的のモードを選択します。

Screenshot showing the Chat view, highlighting the chat mode dropdown list.

VS Codeのチャットモードの詳細についてはこちらをご覧ください。

言語モデルを変更する

VS Codeは、選択可能なさまざまな組み込み言語モデルを提供します。一部のモデルは高速なコーディングタスクに最適化されていますが、他のモデルはより時間のかかる計画および推論タスクに適しています。チャット入力フィールドのモデルピッカーを使用して、Copilotが応答生成に使用するモデルを変更します。

Screenshot of the chat model picker in the Chat view, showing a dropdown list of available models.

他のモデルプロバイダー(プレビュー)からモデルを追加し、チャットで使用することもできます。他のプロバイダーのモデルを使用する方法の詳細をご覧ください。

利用可能なモデルのリストは、Copilotサブスクリプションに基づいて異なり、時間の経過とともに変更される場合があります。利用可能な言語モデルの詳細については、GitHub Copilotのドキュメントを参照してください。利用可能な言語モデル

チャットプロンプトを送信する

自然言語を使用して、VS Codeでチャットリクエストを行います。チャットモードに応じて、コードベースに関する質問をしたり、コードの提案を得たり、プロジェクト内の複数のファイルにわたるコード編集を行ったり、特殊なツールを呼び出したりできます。

チャット応答には、Markdownテキスト、コードブロック、ボタン、ファイルツリーなどの豊富なコンテンツの組み合わせが含まれる場合があります。

Copilot Chat view in the Secondary Side Bar and Explorer view in the Primary Side Bar.

より関連性の高い応答を得たり、テストの失敗やターミナル出力など、ワークスペース内の特定のファイルや成果物を参照したりするには、関連するコンテキスト項目を#-メンションすることでチャットプロンプトにコンテキストを追加します。

チャットコンテキストを追加する

VS Codeは、自然言語プロンプトに基づいてチャットリクエストの意図と範囲を決定しようとします。より関連性の高い応答を得るには、ファイル、テスト結果、ターミナル出力など、追加のコンテキストをチャットプロンプトに提供します。

チャットビューのAdd Contextボタンを使用するか、#-メンションを入力してチャットプロンプトにコンテキストを追加します。たとえば、#codebaseはコードベース全体を参照し、#<file | folder | symbol>はワークスペース内の特定のファイル、フォルダー、またはシンボルを参照します。チャット入力フィールドに#と入力すると、コンテキストアイテムのリストが表示されます。

Screenshot of the Chat view with the context menu open

プロンプトでエージェントモードツールを直接参照するには、#の後にツール名を入力します。これは、すべてのチャットモード(ask、edit、agentモード)で実行できます。たとえば、#fetchツールを使用してWebページのコンテンツをチャットプロンプトのコンテキストとして追加したり、#githubRepoを使用してGitHubリポジトリでコード検索を実行したりできます。

チャットプロンプトにコンテキストを追加するの詳細をご覧ください。

プロンプトの例

一般的な技術トピックについて質問する
  • 「連結リストとは何ですか?」
  • 「人気のあるWebフレームワークトップ10」
コードベースを理解する
  • #codebaseで認証がどのように機能するか説明してください」
  • 「データベース接続文字列はどこに設定されていますか? #codebase
  • 「この#codebaseをビルドするにはどうすればよいですか?」
  • #getUserはどこで使用されていますか? #usages
アプリに新機能を追加する
  • 「アバウトページを作成し、ナビゲーションバーに含めてください #codebase
  • 「アドレス情報を更新するための新しいAPIルートを追加してください #codebase
  • 「ログインボタンを追加し、#styles.cssに基づいてスタイルを設定してください」
ワークスペースの問題を修正する
  • #problemsの問題を修正してください」
  • 「失敗しているテストを修正してください #testFailure
Webからのコンテンツを参照する
  • 「React 18で'useState'フックを使用するにはどうすればよいですか? #fetch https://18.react.dev/reference/react/useState#usage
  • 「アドレス情報をフェッチするAPIエンドポイントを構築し、#githubRepo contoso/api-templatesのテンプレートを使用してください」

その他のプロンプト例については、GitHubドキュメントのCopilot Chat Cookbookを参照してください。

ヒント

Copilotとチャットの操作方法についてヘルプを得るには、チャット入力フィールドに/helpと入力します。

Vision

チャットはビジョン機能をサポートしており、画像をチャットプロンプトのコンテキストとして添付し、それについて質問することができます。たとえば、コードブロックのスクリーンショットを添付してその説明を求めたり、UIのスケッチを添付してエージェントモードにそれを実装するよう依頼したりできます。

ヒント

ウェブブラウザからチャットビューに画像をドラッグアンドドロップして、コンテキストとして追加できます。

チャット履歴

チャットセッションで複数のチャットプロンプトを繰り返し送信すると、VS Codeはチャットプロンプトと応答の履歴を現在のチャットプロンプトのコンテキストとして使用します。これにより、コンテキストを繰り返すことなく、フォローアップの質問をしたり、以前の質問を明確にしたりできます。たとえば、「これは...とどう違うのか」、「テストケースを追加してくれ」、「もっと詳しく説明してくれ」などと質問できます。

いつでも、チャットビューのNew Chat (+) ボタン(⌘N (Windows, Linux Ctrl+N))を使用して新しいチャットセッションを作成できます。これは、別のトピックに移動して以前のコンテキストと履歴を避けたい場合に便利です。

チャットセッションの履歴を表示するには、チャットビューのShow Chats...ボタンを選択するか、コマンドパレットでChat: Show Chats...コマンドを使用します。履歴エントリを選択すると、そのチャットセッションがチャットビューで開き、会話を続行できます。

Screenshot of the Chat view with the Show Chats... button highlighted

コマンドパレットのChat: Export Chat...コマンドを使用して、チャットセッションのすべてのプロンプトと応答をJSONファイルでエクスポートできます。

チャットリクエストを編集する(実験的)

チャットリクエストを編集する機能はVS Codeバージョン1.102以降で利用可能で、現在実験的機能です。

アクティブなチャットセッションで以前のチャットリクエストを編集できます。これは、プロンプトを微調整したり、間違いを修正したりする場合に便利です。以前のチャットリクエストを編集すると、次の手順が実行されます。

  1. 編集されたリクエストとそれに続くすべてのリクエストと応答は会話履歴から削除されます。
  2. これらのリクエストによって行われた編集は、リクエストが行われる前の状態に戻されます。
  3. 編集されたリクエストは会話履歴に追加され、新しい応答のために言語モデルに送信されます。

チャットリクエストの編集は、リクエストを元に戻し、編集されたプロンプトで新しいリクエストを送信することと同等です。

Screenshot of the Chat view with a chat request being edited in-place.

チャットリクエストを編集する方法は、chat.editRequests設定によって設定されます。

  • inline: チャットビューでリクエストを選択すると、その場で編集可能になります。編集モードを終了するにはEscapeを使用します。
  • hover: チャットリクエストにカーソルを合わせ、編集アイコン(鉛筆)を選択すると、その場で編集可能になります。編集モードを終了するにはEscapeを使用します。
  • input: チャットリクエストにカーソルを合わせ、編集アイコン(鉛筆)を選択すると、チャット入力フィールドでリクエストを編集できます。
  • none: チャットビューでのチャットリクエストの編集を無効にします。

チャットリクエストを元に戻す

アクティブなチャットセッションでチャットリクエストを元に戻す(アンドゥ)ことができます。チャットリクエストを元に戻すと、対応する応答も会話履歴から削除されます。

リクエストを元に戻すことは、そのセッションの会話履歴から特定のプロンプトと応答を削除したい場合に便利です。たとえば、言語モデルが関連性の低い応答を提供している、または不要な方向に進んでいることに気づいた場合などです。

チャットリクエストを元に戻すには2つのオプションがあります。

  • 最後のチャットリクエストを元に戻す: チャットビューツールバーのUndo Last Requestボタンを使用します。

    Screenshot of the Chat view with the Undo Last Request button highlighted.

  • 特定のチャットリクエストを元に戻す: チャットビューでチャットリクエストにカーソルを合わせ、リクエストの横にあるUndo Request (Delete) (x) ボタンを選択します(または⌘Backspace (Windows, Linux Delete)を押します)。リクエストを元に戻すと、そのチャットセッションのそれに続くすべてのリクエストと応答も元に戻されます。

    Screenshot of the Chat view with multiple prompts, highlighting the 'x' control to delete a chat prompt and its response.

チャットをエディタータブまたは別のウィンドウで開く

チャットセッションを別のエディタータブとして、または別のフローティングウィンドウとして開くことができます。この機能により、複数のチャットセッションを同時に開くことができます。

チャットビューの右上隅にある...アイコンを選択し、Open Chat in EditorまたはOpen Chat in New Windowを選択します。

Screenshot of the Chat view, highlighting the three-dot menu that contains the Open in Editor and Open in New Window options.

次のスクリーンショットは、フローティングウィンドウで実行されているチャットビューを示しています。

Screenshot of the Chat view, highlighting the three-dot menu that contains the Open in Editor and Open in New Window options. The desktop shows a floating window with a chat session.

デフォルトでは、チャットセッションはコンパクトモードで開かれ、タイトルバーやその他のUI要素は非表示になります。フローティングウィンドウのタイトルバーにあるコンパクトモードアイコンを選択して、コンパクトモードと通常モードを切り替えます。

オプションで、Always on Topモードを有効にすると、チャットビューを常に他のウィンドウの上に表示できます。

VS Codeのフローティングウィンドウの詳細についてはこちらをご覧ください。

音声インタラクションを使用する

VS Code Speech拡張機能によって提供されるVS Codeの音声コントロール機能を使用すると、音声を使用してチャット会話を開始できます。

  • 音声を使用してチャットプロンプトを指示する
  • 「Hey Code」音声コマンドを使用して、Copilot Chatとの音声セッションを開始する
  • 「ホールドトゥスピーク」モードを使用してチャットの音声入力を高速化する

VS Codeで音声インタラクションを使用する方法の詳細についてはこちらをご覧ください。

チャットデバッグビュー

チャットデバッグビューは、AIリクエストと応答の詳細を確認できる専用ビューです。各チャットリクエストについて、システムプロンプト、ユーザープロンプト、および言語モデルに送信されるコンテキストの詳細を確認できます。言語モデルからの詳細な応答と、チャットリクエストの一部として呼び出されるツールからの応答を表示できます。

チャットデバッグビューを開くには、コマンドパレット(⇧⌘P (Windows, Linux Ctrl+Shift+P))からDeveloper: Show Chat Debug Viewコマンドを実行します。

Screenshot of the Chat Debug view, showing the details of a chat request and response.

コマンドラインからチャットを開始する

VS Code CLIのchatサブコマンドを使用して、コマンドラインから直接チャットセッションを開始できます。これにより、現在の作業ディレクトリで、指定したプロンプトでチャットセッションを開くことができます。

たとえば、次のコマンドは現在のディレクトリのチャットを開き、「すべての型なし変数を検索して修正してください」と質問します。

code chat Find and fix all untyped variables

chatサブコマンドには、次のコマンドラインオプションがあります。

  • -m, --mode <mode>: チャットセッションに使用するチャットモード。利用可能なオプション: ask, edit, agent、またはカスタムモードの識別子。デフォルトはagentです。
  • -a, --add-file <path>: ファイルをチャットセッションのコンテキストとして追加します。
  • --maximize: チャットセッションビューを最大化します。
  • -r, --reuse-window: チャットセッションに最後にアクティブだったウィンドウを使用します。
  • -n, --new-window: チャットセッション用に空のウィンドウを開きます。

chatサブコマンドは、コマンドの最後に-を渡すことで、stdinからのパイプ入力をサポートします。例:

python app.py | code chat why does it fail -

プライバシーと透明性

プライベートリポジトリのワークスペース検索機能をさらに有効にするには、追加のアクセス許可が必要です。これらのアクセス許可がまだないことを検出した場合、起動時にそれらを要求します。一度付与されると、将来のためにセッションを安全に保存します。

Modal window asking for additional authentication for a private repository.

セキュリティ、プライバシー、透明性の詳細については、GitHub Copilot Trust Centerを参照してください。

よくある質問

異なるチャットモードはどのように使い分けますか?

異なるチャットモードは、さまざまなユースケースに最適化されています。

  • エディターインラインチャットを使用して、アクティブなエディター内で直接質問したり、編集したりできます。これは、アクティブなファイルに限定されたコード変更や質問を行う場合に便利です。

  • askモードを使用して、コードベースやテクノロジーの概念について質問します。応答にはコードの提案が含まれる場合があり、それらをコードベースに手動で個別に適用できます。変更はコードベースに自動的に適用されません。

  • editモードを使用して、チャットプロンプトに基づいてコードベース内の複数のファイルにわたる編集を直接適用します。プロンプトに関連するコンテキストとファイルを提供します。

  • agentモードを使用して、自律的なコーディングワークフローを開始します。これにより、AIが関連するコンテキストとファイルを自律的に判断し、リクエストを完了するために実行する必要があるタスクを決定します。その後、独立して反復処理を行い、望ましい結果を達成し、発生した問題を修正します。Agentモードは、ターミナルコマンドの実行、テストケースの検証、APIへのアクセスなど、特殊なタスクを実行するために、拡張機能やMCPサーバーからツールを呼び出すことができます。

追加リソース

GitHub CopilotとVS Codeでの使用方法の詳細については、GitHub Copilot documentationを参照してください。

または、YouTubeのVS Code Copilotシリーズをご覧ください。ここでは、CopilotをPythonC#JavaPowerShellC++などで使用するための入門コンテンツやプログラミングに特化したビデオが掲載されています。

次のステップ