🚀 VS Code で を入手しましょう!

VS Code の GitHub Copilot によるコード補完

GitHub Copilot は、AI を活用したペアプログラマーとして機能し、コード、コメント、テストなどを自動的に補完する候補を提供します。コードの記述中にエディター内で直接これらの候補を提供し、幅広いプログラミング言語とフレームワークで動作します。

Copilot は 2 種類の候補を提供します

  • コード補完 - エディターで入力を開始すると、Copilot はコーディングスタイルに一致し、既存のコードを考慮したコード候補を提供します。

  • 次の編集候補 - Copilot の次の編集候補 (別名 Copilot NES) で、次のコード編集を予測します。Copilot NES は、ユーザーが行っている編集に基づいて、次に行いたい編集の場所と、その編集内容の両方を予測します。

はじめに

  1. GitHub Copilot 拡張機能をインストールします。

    GitHub Copilot 拡張機能をインストールする

  2. GitHub アカウントでサインインして Copilot を使用します。

    ヒント

    Copilot サブスクリプションをまだお持ちでない場合は、Copilot Free プランにサインアップして Copilot を無料で使用し、毎月一定の補完とチャットインタラクションの制限を受けることができます。

  3. Copilot クイックスタートで、VS Code の Copilot の主要機能をご覧ください。

インライン提案

Copilot は、入力時にコード候補を提供します。現在の行の補完、またはまったく新しいコードブロックの場合もあります。候補のすべてまたは一部を受け入れることも、入力を続けて候補を無視することもできます。

次の例では、Copilot が JavaScript 関数 calculateDaysBetweenDates の実装を薄暗いゴーストテキストを使用して提案する方法に注目してください

JavaScript ghost text suggestion.

インライン候補が表示されたら、Tab キーで受け入れることができます。

Copilot は、コード候補に対して、コードにすでに存在するのと同じコーディングスタイルを適用しようとします。次の例では、Copilot が提案された subtract メソッドに対して、add メソッドと同じ入力パラメーターの命名規則を適用していることに注目してください。

JavaScript ghost text suggestion.

候補の部分的な受け入れ

GitHub Copilot からの候補全体を受け入れたくない場合があります。⌘→ (Windows、Linux Ctrl+Right) キーボードショートカットを使用して、候補の次の単語または次の行のいずれかを受け入れることができます。

代替候補

特定の入力に対して、Copilot は複数の代替候補を提供する場合があります。候補にカーソルを合わせると、他の候補のいずれかを確認できます。

Hovering over inline suggestions enables you to select from multiple suggestions

コードコメントから候補を生成する

Copilot に候補を提供させるのではなく、コードコメントを使用して、期待するコードに関するヒントを提供できます。たとえば、使用するアルゴリズムまたは概念のタイプ ("再帰を使用" や "シングルトンパターンを使用" など) や、クラスに追加するメソッドとプロパティを指定できます。

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

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

次の編集候補

インライン候補は、コードセクションを自動補完するのに最適です。しかし、ほとんどのコーディングアクティビティは既存のコードの編集であるため、Copilot コード補完の自然な進化として、カーソル位置だけでなく、さらに離れた場所での編集も支援することが考えられます。編集は多くの場合、単独で行われるわけではありません。さまざまなシナリオで行う必要のある編集の論理的な流れがあります。Copilot の次の編集候補 (Copilot NES) は、この進化です。

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

編集候補のナビゲートと受け入れ

Tab キーを使用して、提案されたコード変更をすばやくナビゲートできるため、次に関連する編集を見つける時間を節約できます (ファイルや参照を手動で検索する必要はありません)。その後、再度 Tab キーを押して候補を受け入れることができます。

ガターの矢印は、編集候補が利用可能かどうかを示します。矢印にカーソルを合わせると、キーボードショートカットと設定構成を含む編集候補メニューが表示されます: Copilot NES ガターメニューを展開

編集候補が現在のエディタービューの下にある場合、矢印は右ではなく下を指します: 矢印の方向が変わる Copilot NES

重要

VS Code vim 拡張機能を使用している場合は、keybindings.json を更新することをお勧めします。詳細については、GitHub の issue を参照してください。

次の編集候補のユースケース

ミスの捕捉と修正

  • Copilot は、タイプミスなどの単純なミスを支援します。 cont x = 5 や conts x = 5 など、文字が欠落または入れ替わっている箇所を修正する候補が表示されます (const x = 5 にすべきでした)。

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

  • Copilot は、反転した三項演算子など、より困難なロジックのミスも支援できます

    Copilot NES fixing a fibonacci logic mistake

    または、|| の代わりに && を使用する必要があった比較

    Copilot NES fixing an if statement mistake

意図の変更

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

    Copilot NES gif for updating Point to Point3D

リファクタリング

  • ファイル内で変数を 1 回名前変更すると、Copilot は他のすべての場所で更新することを提案します。 新しい名前または命名パターンを使用すると、Copilot は後続のコードを同様に更新することを提案します。

    Copilot NES suggesting change after updating function name

  • コードスタイルのマッチング。一部のコードをコピー&ペーストした後、Copilot はペーストが発生した現在のコードに一致するように調整する方法を提案します。

コード補完の有効化または無効化

コード補完は、すべての言語または特定の言語のみに対して有効または無効にできます。

  • コード補完を有効または無効にするには、ステータスバーの Copilot メニューを選択し、コード補完を有効または無効にするオプションをオンまたはオフにします。

    Screenshot of the Copilot menu in the Status Bar with checkboxes to enabled or disable code completions and NES.

  • または、設定エディターで github.copilot.enable 設定を変更します。

    コード補完を有効または無効にする言語ごとにエントリを追加します。すべての言語のコード補完を有効または無効にするには、* の値を true または false に設定します。

AI モデルの変更

異なる大規模言語モデル (LLM) は、異なる種類のデータでトレーニングされており、異なる機能と強みを持っている可能性があります。VS Code で異なる AI 言語モデルから選択する方法の詳細については、こちらを参照してください。

エディターでコード補完を生成するために使用される言語モデルを変更するには

  1. VS Code タイトルバーの Copilot メニューから [コード補完の構成...] を選択します。

  2. [補完モデルの変更...] を選択し、リストからモデルの 1 つを選択します。

注

利用可能なモデルのリストは、時間の経過とともに変動および変更する可能性があります。Copilot Business または Enterprise ユーザーの場合、管理者は GitHub.com の Copilot ポリシー設定で Editor Preview Features をオプトインすることにより、組織の特定のモデルを有効にする必要があります。

ヒントとコツ

コンテキスト

関連性の高いインライン候補を提供するために、Copilot はエディターの現在および開いているファイルを見てコンテキストを分析し、適切な候補を作成します。Copilot を使用中に VS Code で関連ファイルを開いておくと、このコンテキストを設定するのに役立ち、Copilot がプロジェクトの全体像を把握できるようになります。

設定

コード補完設定

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

  • editor.inlineSuggest.fontFamily - インライン補完のフォントを構成します。

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

  • editor.inlineSuggest.syntaxHighlightingEnabled - インライン補完の構文強調表示を有効または無効にします。

次の編集候補設定

  • github.copilot.nextEditSuggestions.enabled - Copilot の次の編集候補 (Copilot NES) を有効にします。

  • editor.inlineSuggest.edits.allowCodeShifting - Copilot NES が候補を表示するためにコードをシフトできるかどうかを構成します。

  • editor.inlineSuggest.edits.renderSideBySide - Copilot NES が可能な場合はより大きな候補を並べて表示できるか、または Copilot NES が常に大きな候補を関連するコードの下に表示する必要があるかを構成します。

    • auto (デフォルト): ビューポートに十分なスペースがある場合は、より大きな編集候補を並べて表示し、それ以外の場合は、候補を関連するコードの下に表示します。
    • never: 候補を並べて表示することは決してなく、常に候補を関連するコードの下に表示します。

次のステップ

04/03/2025