VS CodeにおけるGitHub Copilotのインライン提案

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

Copilotからは2種類のインライン提案が提供される場合があり、その両方がユーザーのコーディングスタイルに適合し、既存のコードを考慮します。

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

• 次編集提案: Copilotの次編集提案（別名：Copilot NES）で、次のコード編集を予測します。ユーザーが行っている編集に基づいて、NESは次に編集したいであろう場所とその編集内容の両方を予測します。

前提条件

• マシンにインストールされたVisual Studio Code。こちらのステップに従ってVS Codeをセットアップしてください。
• GitHub Copilotサブスクリプションへのアクセス。こちらのステップに従ってGitHub Copilotをセットアップしてください。Copilot Freeをセットアップして、毎月一定枠のインライン提案とAIクレジットを受け取ることもできます。

ゴーストテキスト提案

初めての提案を受け取る

Copilotは入力中に薄いゴーストテキスト提案を表示します。現在の行の補完のこともあれば、まったく新しいコードブロックのこともあります。

1. 任意のプログラミング言語のファイルを開いて入力を開始します。入力中にCopilotからのインライン提案が表示されるはずです。

   以下の例は、薄いゴーストテキストを使用して、CopilotがJavaScriptのcalculateDaysBetweenDates関数の実装を提案する様子を示しています。

   

2. Tabキーを押して提案を受け入れます。

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

代替の提案

どのような入力に対しても、Copilotは複数の代替提案を提供する場合があります。提案の上にホバーすることで、他の提案を確認して切り替えることができます。

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

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

以下の例は、メソッドとプロパティに関する情報を提供して、生徒を表すTypeScriptクラスを作成するようにCopilotに指示する方法を示しています。

次の編集候補

ゴーストテキスト提案は、コードの一部分を自動補完するのに優れています。しかし、コーディング作業の大部分は既存コードの編集であるため、カーソル位置だけでなく、それ以外の場所の編集もサポートすることは、インライン提案の自然な進化です。多くの場合、編集は単独で行われるのではなく、さまざまなシナリオにおいて、どのような編集を行う必要があるかという論理的な流れが存在します。次編集提案（Copilot NES）は、この進化形です。

ユーザーが行っている編集に基づいて、次編集提案は、次に編集したいであろう場所と、その編集内容の両方を予測します。Copilot NESは現在の作業に関連する今後の変更を提案することで、開発のフローを維持するのに役立ちます。Tabキーを押すことで、Copilotの提案に素早く移動して受け入れることができます。提案は、潜在的な変更の範囲に応じて、単一のシンボル、行全体、または複数行に及ぶ場合があります。

Copilot NESを使い始めるには、VS Codeの設定 github.copilot.nextEditSuggestions.enabled VS Code で開く VS Code Insiders で開く この設定は組織レベルで管理されています。変更するには管理者にお問い合わせください。組織を有効にします。

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

Tabキーを使用すると、提案されたコードの変更に素早く移動できるため、次に関連する編集箇所を探す時間を節約できます（ファイルや参照を手動で検索する必要はありません）。その後、もう一度Tabキーを押すことで、提案を受け入れることができます。

ガター（エディターの行番号の横）にある矢印は、編集提案が利用可能かどうかを示します。この矢印は、現在のカーソル位置から見て、次の編集提案がどこにあるかを示しています。

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

編集提案による集中妨害を減らす

デフォルトでは、編集提案はガターの矢印で示され、コードの変更内容はエディター内に表示されます。 editor.inlineSuggest.edits.showCollapsed VS Code で開く VS Code Insiders で開く 設定を有効にすると、提案に移動するためにTabキーを押すか、ガターの矢印にホバーするまで、エディター内でのコード変更の表示を折りたたむ（非表示にする）ことができます。または、ガターの矢印にホバーしてメニューからShow Collapsed（折りたたんで表示）オプションを選択します。

次編集提案のユースケース

誤りの発見と修正

• Copilotは、タイポなどの単純なミスを助けてくれます。 たとえば、本来 const x = 5 であるべき箇所で、文字が抜けていたり入れ替わったりしている cont x = 5 や conts x = 5 のような場合に、修正案を提案します。

  

• Copilotは、反転した三項演算子など、論理上のより複雑なミスの解決も支援できます。

  

  あるいは、|| の代わりに && を使用すべきだった比較など。

  

意図の変更

• Copilotは、意図の新しい変更に合わせて、コードの残りの部分への変更を提案します。 たとえば、クラスを Point から Point3D に変更すると、Copilotはクラス定義に z 変数を追加することを提案します。その変更を受け入れると、Copilot NESは次に、距離の計算処理に z を追加することを推奨します。

  

リファクタリング

• ファイル内で変数の名前を1回変更するだけで、Copilotが他のすべての場所でもそれを更新するように提案します。 新しい名前や命名パターンを使用すると、Copilotはそれ以降のコードも同様に更新することを提案します。

  

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

インライン提案の有効化または無効化

インライン提案は、すべての言語に対して、または特定の言語に対してのみ、有効または無効にすることができます。インライン提案を有効または無効にするには、ステータスバーのCopilotメニューを選択し、インライン提案を有効または無効にするオプションのチェックボックスをオンまたはオフにします。特定の言語に対してインライン提案を無効にするオプションは、アクティブなエディターの言語によって異なります。

あるいは、設定エディターで github.copilot.enable VS Code で開く 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はエディター内の現在開いているファイルを調べて文脈（コンテキスト）を分析し、適切な提案を生成します。Copilotの使用中にVS Codeで関連するファイルを開いておくことで、この文脈を設定しやすくなり、Copilotがプロジェクトの全体像を把握できるようになります。

設定

ゴーストテキスト提案の設定

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

• editor.inlineSuggest.fontFamily VS Code で開く VS Code Insiders で開く - インライン補完のフォントを設定します。

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

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

次編集提案の設定

• github.copilot.nextEditSuggestions.enabled VS Code で開く VS Code Insiders で開く この設定は組織レベルで管理されています。変更するには管理者にお問い合わせください。組織 - Copilotの次編集提案（Copilot NES）を有効にします。

• editor.inlineSuggest.edits.allowCodeShifting VS Code で開く VS Code Insiders で開く - 提案を表示するために、Copilot NESがコードの位置をシフトできるようにするかどうかを設定します。

• editor.inlineSuggest.edits.renderSideBySide VS Code で開く VS Code Insiders で開く - 可能であればCopilot NESが大きめの提案を左右に並べて（サイド・バイ・サイドで）表示できるようにするか、または常に関連するコードの下に表示するかを設定します。

  • auto (デフォルト): ビューポートに十分なスペースがある場合は、大きめの編集提案を左右に並べて表示します。そうでない場合は、関連するコードの下に表示します。
  • never: 提案を左右に並べて表示することはせず、常に関連するコードの下に表示します。

• github.copilot.nextEditSuggestions.fixes VS Code で開く VS Code Insiders で開く - 診断（波線）に基づいた次編集提案を有効にします。たとえば、インポートの不足など。

• editor.inlineSuggest.minShowDelay VS Code で開く VS Code Insiders で開く - インライン提案を表示するまでに待機するミリ秒単位の時間。デフォルトは 0 です。

次のステップ

• クイックスタートで主な機能を確認しましょう。

• VS CodeのチャットでAIとのチャット会話を活用しましょう。

• YouTubeのVS Code Copilotシリーズのビデオをご覧ください。