02.CustomInstructions.md

GitHub Copilot Lab

What are Copilot Instructions?

GitHub Copilot's "Instructions" are a set of persistently effective context prompts. You can think of them as: before truly starting each conversation or code generation, telling Copilot in advance "who I am, my preferred style, my current project's constraints, what rules to prioritize following". Their role is to make Copilot automatically follow these preferences without you having to repeat them each time.

Core Features:

• Persistence: Set once, continuously effective in the current environment/session
• Strengthen Consistency: Ensure naming conventions, framework agreements, error handling styles, etc. are unified
• Reduce Repetitive Input: Eliminate the need to frequently paste "background/constraints/style" descriptions

Application in This Lab

In this lab, we will use GitHub Copilot to:

• Create copilot-instructions.md file applicable to all target code files
• Create typescript.instructions.md file applicable to typescript files

---

Lab Environment Requirements

Software Requirements

• Node.js: >= 22.0.0
• npm: >= 10.0.0
• VS Code: Latest version
• GitHub Copilot: Logged in

---

Lab Steps

1.1 Objective

Create related instructions files

1.2 Operation Steps

1. Create .github folder

   mkdir .github
   cd .github

2. Create copilot-instructions.md

   In the upper right corner of VS Code Copilot Chat, click "Generate Agent Instructions", the file will be created at .github/copilot-instructions.md

   

3. Create typescript.instructions.md

   Open Copilot Chat in VS Code, select Agent mode, and enter the following prompt:

   Create .github/instructions folder and create typescript.instructions.md. The content should be coding standards suitable for typescript
   

4. Add file type constraints to typescript.instructions.md

   Open typescript.instructions.md in VS Code and add the following code at the first line of the file:

   ---
   applyTo: '**/*.ts'
   ---
   

5. Explain Code

   Close all opened files in VS Code, then open a typescript file and use copilot chat to explain the file's code logic to ensure understanding of the content. You can see that both copilot-instructions.md and typescript.instructions.md are automatically referenced

   Explain this file
   

   

6. Add gitignore Open Copilot Chat in VS Code, select Agent mode, and enter the following prompt:

   Add a gitignore file for this project
   

7. Add settings.json

   Create a .vscode folder in the project root directory, add a settings.json file Add setting: "github.copilot.chat.codeGeneration.useInstructionFiles": false Format can also refer to https://github.com/jacwu/github-materials/blob/main/.vscode/settings.json

   {
     "github.copilot.chat.codeGeneration.useInstructionFiles": false
   }

8. Explain Code

   Use copilot chat again to explain the file's code logic. copilot-instructions.md and typescript.instructions.md are no longer automatically referenced

9. Restore Settings

   Modify the .vscode/settings.json file, set "github.copilot.chat.codeGeneration.useInstructionFiles" to true, and save the file

1.3 Verification

• Both copilot-instructions.md and typescript.instructions.md are automatically referenced
• If typescript.instructions.md is not referenced, please confirm that the current typescript file has been added to the context
• After disabling instruction files through settings.json, instruction files are no longer referenced