GitHub Copilot Tips and Tricks

Transcript

1. GitHub Copilotで できること一挙ご紹介 2024年10月版
2. 田中 裕一 プリンシパルソリューションズエンジニア GitHub @yuichielectric
3. 本日のトピック GitHub Copilotに搭載されている様々な機能、使い方について 「コード補完」、「チャット」、「エディタ機能への統合」、「Copilot Enterpriseでできること」というトピックに沿ってご紹介します。 ※ Visual Studio Code 1.95（2024年10月版）を前提としています。
4. コード補完 いかに適切な文脈を渡すか
5. GitHub Copilot LLM 文脈 提案
6. GitHub Copilot 文脈とは？ GitHub Copilot拡張によって、現在のファイルのカーソルの前後のソースコードや、 別のタブで開いているファイルの中から、関連するコードスニペット （コメント含む）を選択し、優先順位、フィルタリングを経た上でプロンプトに 追加される情報のこと。 https://github.blog/2023-05-17-how-github-copilot-is-getting-better-at-understanding-your-code/
7. GitHub Copilot 関連するファイルは常に開いておこう ピンどめしておくと開き忘れを防ぐことができる。 例） • TypeScriptプロジェクトで使うライブラリの 型定義ファイル（.d.tsファイル） • テストコードを書く時のテスト対象のコード、 もしくはその逆
8. GitHub Copilot C++/C#で自動的に追加される文脈 直接参照しているヘッダーファイルは、開いているかどうかに 関わらず文脈として自動追加 C++: Visual Studio Code: C/C++拡張 1.21以降 + GitHub Copilot拡張1.205以降 Visual Studio: 2022 17.12以降 C#: Visual Studio: 17.11以降 https://devblogs.microsoft.com/cppblog/improving-github-copilot-completions-in-vs-code-for-c-developers/
9. GitHub Copilot 名前は大事 関連するコード箇所を探す上で、変数や関数の名前は大きなヒントとなる。 一貫性のある命名規則を用い、同一の概念に対して異なる名前を つけないように気をつけましょう。 後述する名前の提案機能も合わせて活用しましょう。
10. GitHub Copilot 良い提案を得るために • 複数の提案がある場合もあるので、それを確認 してみる。 ◦ コマンドパレットで “GitHub Copilot: Open Completions Panel” • コメントとして、欲しいコードについての 説明を自然言語で書く。 ◦ 必要に応じて例も書く ◦ 例）「引数Xに〇〇という入力を渡したら××と いう値を返す関数」 • 自分でコードを書き始めてみる。 ◦ 書き始めたコードもCopilotにとっての 文脈となる。
11. GitHub Copilot 特定のファイルを対象外とする GitHubの管理画面（リポジトリ、OrganizationもしくはEnterprise）で 除外するファイルを指定することが可能。 除外対象となったファイルは - コード補完機能の利用ができなくなる - コード補完機能の文脈として使われなくなる GitHub上にリポジトリがあるかどうかに関わらず、除外の対象とする ことが可能 https://docs.github.com/en/copilot/managing-copilot/managing-github-copilot-in-your-organization/setting-policies-for-copilot-in-your-organization/excluding-content-from-github-copilot
12. チャット スラッシュコマンド、エージェント、コンテキスト変数 を使いこなす
13. Chat エディタ上のコンテキストを踏まえた、Copilotとのチャット コーディングに関する質問への回答 コードの説明 ユニットテストの生成 コードの修正提案 可読性の向上 言語変換
14. GitHub Copilot
15. GitHub Copilot 何が文脈として使われるか？ [前提] 基本的には開いているファイルが文脈の候補。 　　 ただし例外もあり（後述）。 1. エディタ上でテキストを選択している場合 　　 → 選択している箇所のテキストが使われる 2. 何も選択していない場合 　　 → アクティブなエディタで表示されている範囲の 　 テキストが使われる 3. コンテキスト変数で指定する（後述）
16. GitHub Copilot Notebookで自動的に追加される文脈 Jupyter Notebook内でのインライン チャットでは、カーネルの状態 （変数や利用可能なパッケージ等） が自動的に追加される。
17. GitHub Copilot 特定のファイルを対象外とする GitHubの管理画面（リポジトリ、OrganizationもしくはEnterprise）で 除外するファイルを指定することが可能。 除外対象となったファイルの内容はチャットの文脈として 使われなくなる GitHub上にリポジトリがあるかどうかに関わらず、除外の対象とする ことが可能 https://docs.github.com/en/copilot/managing-copilot/managing-github-copilot-in-your-organization/setting-policies-for-copilot-in-your-organization/excluding-content-from-github-copilot
18. 言語設定 チャットの返答や コミットメッセージの自動生成 （後述）の言語を指定可能 github.copilot.chat.localeOverride
19. コンテキスト 変数 #で始まり、プロンプトの中に 含めることで文脈を指定する ために使われるもの。 右の例の #file:BookDatabaseImpl.java の部分がコンテキスト変数。 この例だと、指定されたファイル 全体が文脈の対象となる。
20. GitHub Copilot 主要なコンテキスト変数一覧 #selection アクティブなエディタで選択されている箇所 #file 特定のファイル（VS Codeのファイル選択UIが表示される） #editor アクティブなエディタで表示されている箇所 #terminalLastCommand アクティブなターミナルの最後に実行したコマンドの結果 #terminalSelection アクティブなターミナルの選択されている箇所
21. GitHub Copilot コンテキスト変数の利用例 VS Code内のターミナルで、git diffで差分を表示した上で以下のプロンプトを実行 以下の観点でコードをレビューして、修正が必要な箇所を指摘してください。 • コードをさらに簡潔に書くことができるかどうか？ • このコードはコンパイルエラーやランタイムエラーを引き起こさないか？ • セキュリティバグを入れ込んでしまっていないかどうか？ #terminalLastCommand
22. GitHub Copilot
23. GUIでの コンテキスト の指定 チャット入力欄の📎アイコンを クリックすることでコンテキスト を以下から指定することも可能。 - エディタ上の選択範囲 - 現在のエディタの表示範囲 - ターミナル上の選択範囲 - ターミナルの最後のコマンド - コードベース全体 - 特定のシンボル - 特定のファイル
24. GUIでの コンテキスト の指定 ドラッグ&ドロップでファイルを コンテキストとしてチャットに 追加することも可能。
25. カスタム インストラクション （preview） チャットで生成されるコードに 対しての指示をファイルに あらかじめ指定することが可能。 チャットはコンテキストとして使 用するファイルを参考にコードを 生成するが、明示的に指示を出し たい場合には、この機能を使う ことができる。
26. GitHub Copilot
27. カスタム インストラクション （experimental） テスト生成時のカスタムインスト ラクションは別の設定として指定 が可能。
28. スラッシュ コマンド / (スラッシュ) で始まる コマンドの事。 プロンプト中に指定することで Copilotへの依頼を簡潔に記載 することが可能。 右の例では /explain を使って コードの説明を依頼している。
29. GitHub Copilot 主要なスラッシュコマンド /explain 選択されたコードを説明 /tests 選択されたコードのユニットテストを生成。もし既存のテストファイルがある場 合は、その内容を参照して新たなテストケースを追加する。 /doc 選択されたコードのドキュメンテーションコメントを生成 （後述のインラインチャットのみ） /fix 選択されたコードに含まれる問題を修正 /fixTestFailure 失敗したユニットテストを修正 /new 指定されたワークスペースの雛形を生成
30. エージェント @で始まり、プロンプトの中に 含めることで、どこから文脈を 収集するかを指定する。 右の例の @workspace の部分がエージェントの指定。 この例だと、開いていない ファイルも文脈の対象となる。
31. GitHub Copilot 主要なエージェント @workspace ワークスペース全体についてのチャット @terminal ターミナルについてのチャット @vscode VS Codeについてのチャット
32. チャット内で提 案された コードの採用 　　LLMを使用してエディタ内の 　　コードにマッチするように採用 　　エディタのカーソル位置に 　　挿入 　　クリップボードにコピー
33. 使用するモデル の選択 現時点では右の5つのモデルから 選択 ※ チャットで使用するモデルが 　対象です。
34. Edit with Copilot (preview) 修正したいファイル群を指定し、 自然言語で望む変更を指定すると それらにファイルをまたがって 変更する機能。
35. GitHub Copilot
36. エディタ機能への統合
37. インライン チャット チャットペインだけでなく エディタの中でチャットを 実行することが可能。 ここで提案されたコードは エディタ上に直接追記される。
38. インライン チャット 例）エラー処理のコードを 提案してもらう。
39. インライン チャット 例）インラインチャットで /doc を実行してdocstringを 提案してもらう。
40. ターミナル インライン チャット 例）srcディレクトリ以下で ファイルサイズで上位５つの ファイルを列挙
41. エラーの 修正提案 エディタ上のエラー（赤い波線） 箇所のQuick Fixメニューの中に Copilotを使うアイテムが表示。 “Fix using Copilot”を選択すると、 修正提案を適用。
42. エラーの 修正提案 エディタ上のエラー（赤い波線） 箇所のQuick Fixメニューの中に Copilotを使うアイテムが表示。 “Fix using Copilot”を選択すると、 修正提案を適用。
43. シンボルの rename コマンドパレットから“Rename Symbol”を実行すると周囲の文脈 から適切と思われる名前を提案 してくれる。
44. コミット メッセージの 提案 現在の変更差分から、それを 説明するコミットメッセージを 提案。 リポジトリの直近10個の コミット、コミッターの直近10個 のコミットも参照。
45. コードレビュー レビューして欲しい箇所を 選択、もしくは現在の変更に 対してCopilotによるコード レビューを受けることが 可能。 レビューコメントはエディタ上に 表示され、可能な場合は変更提案 も提示される。その変更提案を 採用することも可能。
46. GitHub Copilot
47. コードレビュー レビュー観点をカスタム インストラクションとして 指定することも可能。
48. Thank you