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

Copilot Chatのためのプロンプトエンジニアリング

この記事では、Visual Studio CodeのCopilot Chatからより良い、より関連性の高い応答を得るためのプロンプトの書き方に関するヒントを説明します。「プロンプトエンジニアリング」または「プロンプト作成」は、AIについて議論する際によく耳にする言葉で、AIのAPIエンドポイントにどのような情報がどのようにパッケージ化され、送信されるかを指します。

VS CodeまたはGitHub Copilotを初めて使用する場合は、まずGitHub Copilotの概要記事を確認するか、始め方チュートリアルに直接進むことをお勧めします。

インライン提案とチャットの両方でCopilotの体験を最適化するための様々なオプションがあります。

Copilotのインライン提案を最大限に活用する

GitHub Copilot拡張機能は、より効率的にコードを記述できるように提案を自動的に表示します。Copilotが可能な限り最高の提案を提供するのに役立つ(「プロンプト」する)ことがいくつかあります。そして良いニュースは、これらはあなたとあなたの同僚があなたのコードを理解するのに役立つため、おそらくあなたはすでにこれらを行っているということです。

Copilotにコンテキストを提供する

Copilotは、あなたが何をしていて、何を助けたいのかを知るための十分なコンテキストを持っている場合に最適に機能します。特定のプログラミングタスクで助けを求めるときに同僚にコンテキストを提供するのと同じように、Copilotでも同じことができます。

ファイルを開く

コード補完の場合、Copilotはエディター内の現在開いているファイルを調べてコンテキストを分析し、適切な提案を作成します。Copilotを使用中にVS Codeで関連ファイルを開いておくことで、このコンテキストを設定し、Copilotがプロジェクト全体のより大きな視点を見るのに役立ちます。

トップレベルのコメント

同僚に簡潔で高レベルの紹介をするのと同じように、作業中のファイルのトップレベルのコメントは、Copilotが作成している部分の全体的なコンテキストを理解するのに役立ちます。

適切なインクルードと参照

作業に必要なインクルードやモジュール参照は手動で設定することをお勧めします。Copilotは提案を作成できますが、どのような依存関係を含める必要があるかは、おそらくあなたが最もよく知っています。これは、Copilotが提案を作成する際に、どのフレームワーク、ライブラリ、およびそのバージョンを使用したいかを把握するのにも役立ちます。

次のTypeScriptの例では、`add`メソッドの出力をログに記録したいと考えています。インクルードがない場合、Copilotは`console.log`の使用を提案します。

Copilot inline suggestion proposes Console.log when no imports in the file.

一方、`Log4js`への参照を追加すると、Copilotはそのフレームワークを使用して出力をログに記録することを提案します。

Copilot inline suggestion proposes logging using the imported logging framework.

意味のある関数名

`fetchData()`というメソッド名が同僚(または数か月後のあなた)にとってあまり意味がないのと同じように、`fetchData()`はCopilotにとっても役立ちません。意味のある関数名を使用すると、Copilotがあなたが望むことを実行する本体を提供するのに役立ちます。

具体的で範囲の明確な関数コメント

関数名は、長すぎずに記述できる程度には限定的です。関数コメントは、Copilotが知る必要のある詳細を補完するのに役立ちます。

サンプルコードでCopilotを準備する

Copilotを適切な方向に向かわせる一つのコツは、探しているものに近いサンプルコードを開いているエディターにコピー&ペーストすることです。小さな例を提供することで、Copilotが達成したい言語やタスクに一致する提案を生成するのに役立ちます。Copilotがあなたが望む、実際に使用するコードを提供し始めたら、ファイルからサンプルコードを削除できます。これは、Copilotが古いコード提案をデフォルトで提供する場合に、新しいライブラリバージョンにCopilotを素早く切り替えるのに特に役立ちます。

一貫性を保ち、品質基準を高く保つ

Copilotは、既存のパターンに従う提案を生成するためにあなたのコードに強く依存するため、「ゴミを入れるとゴミが出る(garbage in, garbage out)」という格言が当てはまります。

常に高い品質基準を維持するには規律が必要です。特に、何かを動かすために高速かつ雑にコーディングしている場合、「ハッキング」モード中はCopilotの補完機能を無効にしたいと思うかもしれません。Copilotのステータスバー項目を選択して、Copilotステータスメニュードロップダウンを表示すると、一時的に補完機能を無効にできます。

Hover over the Copilot Status bar item displays "Show Copilot status menu"

ドロップダウンから、補完機能を完全に無効にしたり、アクティブなファイルタイプ(例:Markdownファイル)のみを無効にしたりできます。

Copilot Status menu dropdown with Disable Completions selected

Copilot Chatを最大限に活用する

GitHub Copilot Chat拡張機能をインストールすることで、Copilotからチャットインターフェース経由で支援を受けることもできます。

GitHub Copilotとチャットでやり取りする際、エクスペリエンスを最適化するためにできることがいくつかあります。

チャット参加者とスラッシュコマンドを使用する

チャット参加者は、コードベースや特定のドメインまたはテクノロジーに関する追加のコンテキストを収集するように設計されています。適切な参加者を使用することで、AIはLLMに送信するためのより良い情報を見つけて提供できます。たとえば、開いているプロジェクトについて質問したい場合は`@workspace`を使用し、VS Codeの機能やAPIについて詳しく知りたい場合は`@vscode`を使用します。

Asking the @vscode participant how to change the VS Code colors

スラッシュコマンドは、質問する際にCopilot Chatがあなたの**意図**を理解するのに役立ちます。あなたはコードベースについて学習していますか(`/explain`)、問題の修正を手伝ってほしいですか(`/fix`)、それともテストケースを作成していますか(`/tests`)?あなたが何をしようとしているかをCopilot Chatに伝えることで、それはあなたのタスクに合わせて返信を調整し、役立つコマンド、設定、コードスニペットを提供できます。

Inline Chat slash command list

プロジェクトの範囲や現在のタスクを自然言語クエリで記述することもできますが、チャット参加者とスラッシュコマンドを使用する方がより簡潔で明示的です。

Copilot Chatでのチャット参加者スラッシュコマンドについて詳しくはこちら。

コンテキストにチャット変数を使用する

`@workspace`や`@vscode`などのチャット参加者は、ドメイン固有のコンテキストを提供するチャット変数を貢献できます。チャットプロンプトで`#`記号を使用してチャット変数を参照できます。チャット変数を使用することで、チャットプロンプトに含めるコンテキストをより具体的に指定できます。

たとえば、`#<ファイル名>`または`#<フォルダ名>`を使用して、ワークスペースから特定のファイルやフォルダをチャットプロンプトで参照できます。これにより、作業中のファイルに関するコンテキストを提供することで、Copilot Chatからの回答をコードにより関連性の高いものにするのに役立ちます。「#package.jsonに改善点を提案してもらえますか?」や「#devcontainer.jsonに拡張機能を追加するにはどうすればよいですか?」といった質問ができます。

また、チャットビューの**コンテキストをアタッチ**ボタンを使用して、チャットメッセージにコンテキストを追加することもできます。その後、現在の選択範囲、ワークスペースから1つ以上のファイル、またはソースコードから1つ以上のシンボルなど、クイックピックから特定の種類のコンテキストを選択できます。

Screenshot of VS Code Copilot Chat view, showing the Attach context button and context Quick Pick.

Copilot Chatでのコンテキスト変数の使用について詳しくはこちら。

具体的に、そしてシンプルに保つ

Copilotに何かを依頼するときは、具体的に依頼し、大きなタスクを別々の小さなタスクに分解してください。たとえば、TypeScriptとPugを使用し、MongoDBデータベースからデータを取得する製品ページを持つExpressアプリの作成をCopilotに依頼しないでください。代わりに、まずCopilotにTypeScriptとPugでExpressアプリを作成するよう依頼します。次に、製品ページを追加するよう依頼し、最後にデータベースから顧客データを取得するよう依頼します。

Copilotに特定のタスクを実行するよう依頼するときは、使用したい入力、出力、API、またはフレームワークについて具体的に指定してください。プロンプトが具体的であればあるほど、結果は良くなります。たとえば、「データベースから製品データを読み込む」ではなく、「カテゴリ別にすべての製品を読み込み、データをJSON形式で返し、Mongooseライブラリを使用する」とします。

ソリューションを反復する

Copilot Chatに助けを求めたとき、最初の応答で満足する必要はありません。ソリューションを改善するためにCopilotに反復してプロンプトを出すことができます。Copilotは、生成されたコードと現在の会話の両方のコンテキストを持っています。

インラインチャットを使用してフィボナッチ数を計算する関数を作成する例を次に示します。

First response from Copilot for a function to calculate Fibonacci numbers

再帰を使用しないソリューションを好むかもしれません。

Ask Copilot to not use recursion and new result

コーディング規約に従うようにCopilotに依頼したり、変数名を改善したりすることもできます。

Ask Copilot to use better variable names and new result

すでに結果を受け入れた場合でも、後でいつでもCopilotにコードを反復させるように依頼できます。

Copilotのプロンプトに関するその他のリソース

GitHub Copilotを生産的に使用する方法についてさらに詳しく知りたい場合は、以下の動画とブログ記事を参照してください。