為您的專案自訂 AI

本指南將引導你在 Visual Studio Code 中為你的專案設定 AI 自訂功能。你將從基礎的程式碼標準開始，並逐步新增更具針對性的功能。

完成後，你的專案將具備：

• 適用於每次對話請求的專案級程式碼標準
• 針對前端程式碼的檔案專屬指令
• 用於常見任務的可重複使用提示詞檔案
• 具備受限工具的自訂 Agent
• 專門執行特定功能的技能

先決條件

• 已安裝 VS Code
• 擁有 GitHub Copilot 方案（免費版、Pro、商務版或企業版）
• 已安裝 GitHub Copilot 擴充功能
• 在 VS Code 中開啟的工作區或資料夾

步驟 1：設定專案級的程式碼標準

首先建立一個記錄專案程式碼標準的指令檔案。這些指令會自動包含在每次對話請求中。

1. 開啟聊天檢視 (⌃⌘I (Windows、Linux Ctrl+Alt+I))。

2. 輸入 /init 並按下 Enter。

   /init
   

3. VS Code 會分析你的專案結構，並產生專屬於你程式碼庫的 .github/copilot-instructions.md 檔案。

4. 審查產生的檔案並進行自訂。例如，加入關於你偏好的匯入 (import) 風格規則。

   ## Imports
   - Use named imports instead of default imports.
   - Group imports: external libraries first, then internal modules, then relative paths.
   

5. 儲存檔案。

驗證是否生效：要求 Copilot 產生一些程式碼（例如：「建立一個日期格式化的公用函式」）。檢查回應是否遵循你的程式碼標準。在對話回應中選擇「參考 (References)」區段，以確認 copilot-instructions.md 已被納入。

步驟 2：新增檔案專屬的指令

當程式碼庫的不同部分遵循不同的慣例時，請使用帶有 applyTo 模式的指令檔案，以針對特定檔案類型進行設定。

1. 開啟聊天檢視 (⌃⌘I (Windows、Linux Ctrl+Alt+I))。

2. 輸入 /create-instructions，接著輸入你想要建立的指令描述，然後按下 Enter。

   /create-instructions React-specific coding standards
   

3. 回答關於指令的釐清問題，並審查產生的指令檔案。

驗證是否生效：開啟一個 .tsx 檔案並要求 Copilot 「建立一個使用者個人資料卡片元件」。回應應遵循你針對 React 的慣例。檢查「參考 (References)」區段以確認指令檔案已套用。

步驟 3：建立可重複使用的提示詞 (Prompt) 檔案

提示詞檔案將常見任務編碼為斜線指令，供你在對話中使用。為你經常執行的任務建立一個提示詞檔案。

1. 開啟聊天檢視 (⌃⌘I (Windows、Linux Ctrl+Alt+I))。

2. 輸入 /create-prompt，接著輸入你想要建立的提示詞描述，然後按下 Enter。

   /create-prompt Scaffold a new React component with tests
   

3. 回答關於提示詞的釐清問題，並審查產生的提示詞檔案。

驗證是否生效：在對話視窗中，輸入 /<提示詞名稱> 帶有排序與篩選功能的資料表格 並按下 Enter。Agent 應根據你的慣例建立元件骨架與測試檔案。

步驟 4：建立自訂 Agent

自訂 Agent 讓 AI 能夠採取具備特定工具存取權的專業角色。建立一個只能讀取程式碼而無法修改它的程式碼審查 (Code Reviewer) Agent。

1. 開啟聊天檢視 (⌃⌘I (Windows、Linux Ctrl+Alt+I))。

2. 輸入 /create-agent，接著輸入你想要建立的 Agent 描述，然後按下 Enter。

   /create-agent A code reviewer that analyzes code for quality, security, and best practices without modifying files
   

3. 回答關於 Agent 的釐清問題，並審查產生的 Agent 檔案。

驗證是否生效：在對話視窗的 Agent 下拉選單中選擇「Reviewer」Agent，然後詢問「審查驗證模組」。Agent 應該在不進行任何更改的情況下分析程式碼。

步驟 5：為特定功能建立技能 (Skill)

技能 (Skills) 是包含指令、指令碼與資源的資料夾，當執行特定專業任務時，Copilot 會載入這些內容。與定義程式碼標準的指令檔案不同，技能是教導 Copilot 如何執行特定的工作流程。

1. 從指令面板 (⇧⌘P (Windows, Linux Ctrl+Shift+P)) 執行「Chat: Open Customizations」指令，以開啟 Agent 自訂編輯器。

2. 選取「Skills」分頁，然後從下拉選單中選取「New Skill (Workspace)」。

3. 輸入技能名稱（例如 update-readme），然後按下 Enter。

4. 將下列內容新增至 SKILL.md 檔案中。

   ---
   name: update-readme
   description: Update the project README to reflect recent code changes. Whenever code changes are made, this skill reviews the changes and updates the README with new features, usage instructions, and API references.
   ---
   # Update README
   
   When updating the README:
   1. Review recent code changes to identify new or modified features
   2. Update the relevant sections (installation, usage, API reference)
   3. Add entries for new commands, configuration options, or environment variables
   4. Remove documentation for deleted or deprecated features
   5. Keep the existing tone, structure, and formatting conventions
   

驗證是否生效：在對話中，要求 Copilot 為你的專案新增一項新功能（例如：「新增一個健康檢查端點 (health check endpoint)」）。當它產生程式碼時，也應該自動更新 README 並加入該新端點的說明文件。你也可以直接在對話視窗中輸入 /update-readme 來呼叫該技能。

你所建構的內容

你的專案現在擁有分層式的 AI 自訂設定。

your-project/
  .github/
    copilot-instructions.md          # Project-wide coding standards (Step 1)
    instructions/
      react.instructions.md          # React-specific conventions (Step 2)
    prompts/
      create-component.prompt.md     # Reusable component scaffolding (Step 3)
    agents/
      reviewer.agent.md              # Read-only code reviewer (Step 4)
    skills/
      update-readme/
        SKILL.md                     # README updater workflow (Step 5)

後續步驟

• 新增 MCP 伺服器以透過外部工具與服務擴充 Agent 功能。
• 設定 Hook 以在 Agent 生命週期中的特定時間點自動化任務（例如在每次檔案編輯後執行格式化）。
• 瀏覽 Agent 外掛程式，從社群市集中安裝預先封裝好的自訂功能。
• 將 .github/ 目錄提交至你的儲存庫，與你的團隊共享自訂設定。
• 透過 Agent 自訂編輯器在同一處瀏覽你所有的自訂設定。