エージェント型開発を探求する -

VS CodeにおけるGitHub Copilotのインラインサジェスト(提案)

VS CodeのGitHub Copilotは、AIを活用したインラインサジェスト機能を提供し、入力中にコード、コメント、テストなどを補完します。インラインサジェストは、幅広いプログラミング言語やフレームワークで利用可能です。これは、自律的な複数ファイルタスクのためのエージェントチャット、およびスマートアクションと並び、VS CodeにおけるAI機能の1つです。

Copilotからは2種類のインラインサジェストが提供されることがあります。どちらもコーディングスタイルに適合し、既存のコードを考慮に入れたものです。

  • ゴーストテキストによる提案:エディタで入力を開始すると、現在のカーソル位置に淡い色でゴーストテキストの提案が表示されます。

  • 次回の編集提案(Next edit suggestions):Copilotの次回の編集提案(Copilot NES)により、次のコード編集を予測します。行っている編集に基づいて、NESは次に編集すべき場所とその内容の両方を予測します。

前提条件

  • マシンにインストールされたVisual Studio Codeが必要です。以下の手順に従ってVS Codeをセットアップしてください。
  • GitHub Copilotのサブスクリプションへのアクセス権が必要です。以下の手順に従ってGitHub Copilotをセットアップしてください。Copilot Freeを設定すると、月ごとのインラインサジェスト数とチャット対話数に制限付きで利用できます。

ゴーストテキストによる提案

最初の提案を受け取る

Copilotは入力中に淡いゴーストテキストで提案を表示します。現在の行の補完だけでなく、コードブロック全体を提案することもあります。

  1. 任意のプログラミング言語でファイルを開き、入力を開始してください。入力中にCopilotからのインラインサジェストが表示されるはずです。

    次の例は、calculateDaysBetweenDatesというJavaScript関数の実装を、Copilotが淡いゴーストテキストを使用してどのように提案するかを示しています。

    JavaScript ghost text suggestion.

  2. Tabキーを押すと、提案を受け入れることができます。

    提案の一部を受け入れるには、⌘→ (Windows, LinuxではCtrl+Right)キーボードショートカットを使用して、提案の次の単語または次の行までを受け入れます。

代替の提案

特定の入力に対して、Copilotは複数の代替案を提示することがあります。提案にマウスカーソルを合わせると、他の提案を確認できます。

Hovering over inline suggestions enables you to select from multiple suggestions

コードコメントから提案を生成する

Copilotの提案に頼るだけでなく、コードコメントを使用して、どのようなコードを期待しているかヒントを与えることができます。例えば、アルゴリズムや概念の種類(「再帰を使用する」や「シングルトンパターンを使用する」など)、あるいはクラスに追加するメソッドやプロパティなどを指定できます。

次の例は、TypeScriptで学生を表すクラスを作成するようCopilotに指示する方法を示しており、メソッドやプロパティに関する情報を指定しています。

Use code comments to let Copilot generate a Student class in TypeScript with properties and methods.

次の編集候補

ゴーストテキストによる提案は、コードの一部を自動補完するのに優れています。しかし、コーディング作業の大部分は既存コードの編集であるため、カーソル位置だけでなく、離れた場所の編集も支援することは、インラインサジェストの自然な進化形と言えます。編集は孤立して行われることは少なく、状況に応じて論理的なフローが存在します。次回の編集提案(Copilot NES)は、この進化を体現するものです。

行っている編集に基づいて、次回の編集提案は、次に編集すべき場所とその内容を予測します。Copilot NESは、現在の作業に関連する将来の変更を提案することで、作業の流れを維持するのに役立ちます。Tabキーを押すと、Copilotの提案にすばやく移動して受け入れることができます。変更の範囲に応じて、提案は単一のシンボル、行全体、または複数行に及ぶ場合があります。

Copilot NESを開始するには、VS Codeの設定で github.copilot.nextEditSuggestions.enabled Open in VS Code Open in VS Code Insiders を有効にします。

編集提案の移動と受け入れ

提案されたコードの変更箇所へTabキーを使って素早く移動できるため、次の関連する編集箇所を探す手間が省けます(ファイルやリファレンスを手動で検索する必要はありません)。その後、もう一度Tabキーを押すと、提案を受け入れることができます。

ガター(行番号の横の余白)にある矢印は、編集提案が利用可能であることを示しています。この矢印は、現在のカーソル位置から見て、次の編集提案がどこにあるかを示しています。

矢印にカーソルを合わせると、キーボードショートカットや設定構成を含む編集提案メニューを表示できます。

Copilot NES gutter menu expanded

重要

VS Code Vim拡張機能をご利用の場合は、NESとのキーバインドの競合を避けるため、最新バージョンの拡張機能を使用してください。

編集提案による注意散漫の低減

デフォルトでは、編集提案はガターの矢印で示され、コードの変更はエディタ内に表示されます。 editor.inlineSuggest.edits.showCollapsed Open in VS Code Open in VS Code Insiders 設定を有効にすると、Tabキーを押して提案に移動するか、ガターの矢印にマウスを合わせるまで、コードの変更が表示されなくなります。または、ガターの矢印にマウスを合わせ、メニューから「折りたたんで表示 (Show Collapsed)」を選択してください。

次回の編集提案の活用例

間違いの発見と修正

  • Copilotはタイプミスのような単純な間違いを支援します。 文字が抜けている、あるいは入れ替わっている場合(例:cont x = 5conts x = 5const x = 5にすべき場合など)に修正を提案します。

    NES fixing a typo from "conts" to "const"

  • Copilotは、ロジックに関するより困難な間違いの支援も可能です。 例えば、三項演算子の逆転などです。

    NES fixing a ternary logic mistake

    あるいは、||の代わりに&&を使用すべき比較演算の修正などです。

    NES fixing an if statement mistake

意図の変更

  • Copilotは、新しい意図の変更に合うよう、残りのコードの変更を提案します。 例えば、クラスをPointからPoint3Dに変更する場合、Copilotはクラス定義にz変数を追加するよう提案します。変更を受け入れた後、Copilot NESは続けて距離計算にzを追加することを推奨します。

    NES gif for updating Point to Point3D

リファクタリング

  • ファイル内の変数を一度名前変更すると、Copilotは他の場所でも更新するよう提案します。 新しい名前や命名規則を使用する場合、Copilotは後続のコードも同様に更新するよう提案します。

    Copilot NES suggesting change after updating function name

  • コードスタイルの適合。コードをコピー&ペーストした後、Copilotは貼り付け先の現在のコードに合わせて調整する方法を提案します。

インラインサジェストの有効化と無効化

インラインサジェストは、すべての言語に対して有効化・無効化することも、特定の言語のみに適用することもできます。インラインサジェストの有効・無効を切り替えるには、ステータスバーのCopilotメニューを選択し、オプションのチェックをオンまたはオフにします。特定の言語に対する無効化オプションは、アクティブなエディタの言語に依存します。

Screenshot of the Copilot menu in the Status Bar with Snooze and Cancel Snooze buttons.

あるいは、設定エディタで github.copilot.enable Open in VS Code Open in VS Code Insiders 設定を変更します。インラインサジェストを有効または無効にしたい言語ごとにエントリを追加してください。すべての言語に対して一括設定するには、*の値にtrueまたはfalseを設定します。

エディタ内のすべてのインラインサジェストを一時的に無効にするには、ステータスバーのCopilotメニューから「スヌーズ (Snooze)」を選択すると、スヌーズ時間を5分ずつ延長できます。インラインサジェストを再開するには、Copilotメニューで「スヌーズをキャンセル (Cancel Snooze)」を選択します。

あるいは、コマンドパレットで「Snooze Inline Suggestions」および「Cancel Snooze Inline Suggestions」コマンドを使用してください。

提案に使用するAIモデルの変更

異なる大規模言語モデル(LLM)は、異なるタイプのデータでトレーニングされており、機能や強みが異なる場合があります。VS Codeで異なるAI言語モデルを選択する方法の詳細をご覧ください。

エディタでゴーストテキストによる提案の生成に使用される言語モデルを変更するには:

  1. コマンドパレット (F1) を開きます。

  2. change completions model と入力し、GitHub Copilot: Change Completions Model コマンドを選択します。

  3. ドロップダウンメニューから、使用したいモデルを選択します。

注意

利用可能なモデルのリストは時間の経過とともに変更される可能性があります。モデル選択機能には必ずしも複数のモデルが表示されるわけではありません。プレビューモデルやその他のインラインサジェスト用モデルは、リリースされ次第表示されるようになります。Copilot BusinessまたはEnterpriseのユーザーの場合、組織の管理者がGitHub.comのCopilotポリシー設定で「Editor Preview Features」をオプトインし、特定のモデルを有効にする必要があります。

ヒントとテクニック

コンテキスト

適切なインラインサジェストを提供するため、Copilotはエディタで開いている現在のファイルなどを参照し、コンテキストを分析して適切な提案を作成します。Copilotを使用する際、関連するファイルをVS Codeで開いておくと、このコンテキストが強化され、Copilotがプロジェクトの全体像を把握しやすくなります。

設定

ゴーストテキストによる提案の設定

  • github.copilot.enable Open in VS Code Open in VS Code Insiders - すべての言語、または特定の言語に対してインライン補完を有効または無効にします。

  • editor.inlineSuggest.fontFamily Open in VS Code Open in VS Code Insiders - インライン補完に使用するフォントを設定します。

  • editor.inlineSuggest.showToolbar Open in VS Code Open in VS Code Insiders - インライン補完時に表示されるツールバーを有効または無効にします。

  • editor.inlineSuggest.syntaxHighlightingEnabled Open in VS Code Open in VS Code Insiders - インライン補完の構文ハイライトを有効または無効にします。

次回の編集提案の設定

  • github.copilot.nextEditSuggestions.enabled Open in VS Code Open in VS Code Insiders - Copilotの次回の編集提案(Copilot NES)を有効にします。

  • editor.inlineSuggest.edits.allowCodeShifting Open in VS Code Open in VS Code Insiders - Copilot NESが提案を表示するためにコードをシフト(移動)できるようにするかを設定します。

  • editor.inlineSuggest.edits.renderSideBySide Open in VS Code Open in VS Code Insiders - 可能であれば大きな提案を並べて表示するか、常にコードの下に表示するかを設定します。

    • auto(デフォルト):ビューポートに十分なスペースがある場合は大きな編集提案を並べて表示し、そうでない場合は関連するコードの下に提案を表示します。
    • never:提案を並べて表示することは決して行わず、常にコードの下に表示します。
  • github.copilot.nextEditSuggestions.fixes Open in VS Code Open in VS Code Insiders - 診断(波線)に基づいた次回の編集提案を有効にします(例:インポートの不足)。

  • editor.inlineSuggest.minShowDelay Open in VS Code Open in VS Code Insiders - インラインサジェストを表示するまでの待機時間(ミリ秒単位)。デフォルトは0です。

次のステップ

© . This site is unofficial and not affiliated with Microsoft.