VS Code 中 GitHub Copilot 的內嵌建議

VS Code 中的 GitHub Copilot 提供由 AI 驅動的內嵌建議,可在您輸入時完成您的程式碼、註解、測試等。內嵌建議支援多種程式語言和框架。它們是 VS Code 中多個 AI 介面之一,與用於自主多檔案任務的代理程式聊天以及智慧動作並存。

您可能會體驗到兩種 Copilot 內嵌建議,它們都符合您的程式碼風格並考量您現有的程式碼

  • 幽靈文字建議:在編輯器中開始輸入,Copilot 會在您目前的游標位置提供變暗的幽靈文字建議。

  • 下一步編輯建議:使用 Copilot 下一步編輯建議 (亦稱 Copilot NES) 預測您的下一個程式碼編輯。根據您正在進行的編輯,NES 會預測您想要進行的下一個編輯的位置以及該編輯的內容。

先決條件

  • 您的機器上已安裝 Visual Studio Code。請依照這些步驟設定 VS Code
  • 擁有 GitHub Copilot 訂閱權限。請依照這些步驟設定 GitHub Copilot。您可以設定 Copilot Free 以獲得每月有限的內嵌建議和聊天互動次數。

幽靈文字建議

取得您的第一個建議

Copilot 會在您輸入時提供變暗的幽靈文字建議:有時是目前行的完成,有時是一整個新的程式碼區塊。

  1. 開啟您選擇的程式語言檔案並開始輸入。您應該會在輸入時看到 Copilot 的內嵌建議。

    以下範例展示 Copilot 如何使用變暗的幽靈文字來建議 calculateDaysBetweenDates JavaScript 函式的實作

    JavaScript ghost text suggestion.

  2. 按下 Tab 鍵以接受建議。

    若要部分接受建議,請使用 ⌘→ (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 NES) 正是這種演變。

根據您正在進行的編輯,下一步編輯建議會預測您想要進行的下一個編輯的位置以及該編輯的內容。Copilot NES 協助您保持流暢的工作狀態,建議與您目前工作相關的未來變更,您可以按下 Tab 鍵快速導覽並接受 Copilot 的建議。建議可能涵蓋單一符號、整行或多行,具體取決於潛在變更的範圍。

若要開始使用 Copilot NES,請啟用 VS Code 設定 github.copilot.nextEditSuggestions.enabled 在 VS Code 中開啟 在 VS Code Insiders 中開啟

導覽並接受編輯建議

您可以使用 Tab 鍵快速導覽至建議的程式碼變更,省去了尋找下一個相關編輯的時間 (無需手動搜尋檔案或參考)。然後,您可以再次按下 Tab 鍵來接受建議。

邊欄的箭頭會指出是否有可用的編輯建議。箭頭會顯示下一個編輯建議的位置,相對於您目前的游標位置。

您可以將滑鼠游標懸停在箭頭上,以瀏覽編輯建議選單,其中包含鍵盤快速鍵和設定組態

Copilot NES gutter menu expanded

重要

如果您是 VS Code vim 擴充功能使用者,請使用最新版本的擴充功能,以避免與 NES 的鍵盤快速鍵發生衝突。

減少編輯建議造成的干擾

預設情況下,編輯建議會以邊欄箭頭指示,並且程式碼變更會顯示在編輯器中。啟用 editor.inlineSuggest.edits.showCollapsed 在 VS Code 中開啟 在 VS Code Insiders 中開啟 設定,以便只在您按下 Tab 鍵導覽至建議或將滑鼠游標懸停在邊欄箭頭上時,才顯示編輯器中的程式碼變更。或者,將滑鼠游標懸停在邊欄箭頭上,然後從選單中選取顯示已摺疊選項。

下一步編輯建議的應用案例

捕捉並修正錯誤

  • Copilot 協助修正簡單的錯誤,例如打字錯誤。它會建議修正缺少或交換字母的地方,例如 cont x = 5conts x = 5,這些都應該是 const 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 在 VS Code 中開啟 在 VS Code Insiders 中開啟 設定。為您要啟用或停用內嵌建議的每種語言新增一個項目。若要啟用或停用所有語言的內嵌建議,請將 * 的值設定為 truefalse

若要暫時停用編輯器中的所有內嵌建議,請在狀態列中選取 Copilot 選單,然後選取暫停按鈕,以將暫停時間增加五分鐘。若要恢復內嵌建議,請在 Copilot 選單中選取取消暫停按鈕。

或者,在命令選擇區中使用暫停內嵌建議取消暫停內嵌建議命令。

變更建議的 AI 模型

不同的大型語言模型 (LLMs) 在不同類型的資料上進行訓練,可能具有不同的功能和優勢。深入瞭解如何在 VS Code 中選擇不同的 AI 語言模型

若要變更用於在編輯器中產生幽靈文字建議的語言模型

  1. 開啟命令選擇區 (F1)。

  2. 輸入變更完成模型並選取GitHub Copilot: 變更完成模型命令。

  3. 在下拉式選單中,選取您要使用的模型。

注意

可用模型的清單可能會有所不同並隨時間變更。模型選擇器可能不會總是顯示多個模型,如果/當我們發布預覽模型和其他內嵌建議模型時,它們將會在此處提供。如果您是 Copilot Business 或 Enterprise 使用者,您的管理員需要透過在 GitHub.com 的Copilot 政策設定中選擇啟用 Editor Preview Features,來為您的組織啟用某些模型。

訣竅與技巧

內容脈絡

為了提供您相關的內嵌建議,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 是否盡可能並排顯示較大的建議,或者 Copilot NES 是否應始終在相關程式碼下方顯示較大的建議。

    • 自動 (預設):如果檢視區有足夠空間,則並排顯示較大的編輯建議,否則建議會在相關程式碼下方顯示。
    • 永不:永不並排顯示建議,一律在相關程式碼下方顯示建議。
  • github.copilot.nextEditSuggestions.fixes 在 VS Code 中開啟 在 VS Code Insiders 中開啟 - 根據診斷 (波浪線) 啟用下一步編輯建議。例如,缺少匯入項目。

  • editor.inlineSuggest.minShowDelay 在 VS Code 中開啟 在 VS Code Insiders 中開啟 - 顯示內嵌建議前等待的毫秒數。預設值為 0

後續步驟

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