Tipps und Tricks für Copilot in VS Code

Dieser Artikel bietet Tipps und Tricks zur Optimierung Ihrer Entwicklungserfahrung bei der Verwendung von GitHub Copilot in Visual Studio Code.

Checkliste für die Verwendung von Copilot in VS Code

Verwenden Sie die folgende Checkliste, um das Beste aus Copilot herauszuholen

1. Wählen Sie das richtige Tool. Verwenden Sie das Tool, das für die Bearbeitung, das Stellen von Fragen oder das Beibehalten des Code-Schreibflusses optimiert ist.

2. Personalisieren Sie Copilot. Verwenden Sie benutzerdefinierte Anleitungen, um Codevorschläge zu erhalten, die Ihrem Stil und Ihren Codierungspraktiken entsprechen.

3. Schreiben Sie effektive Prompts und stellen Sie Kontext bereit. Erhalten Sie die relevantesten Antworten.

4. Indizieren Sie Ihren Arbeitsbereich. Erhalten Sie genaue Antworten auf Fragen zu Ihrer Codebasis.

5. Wählen Sie Ihr KI-Modell. Wählen Sie zwischen Modellen für schnelles Codieren oder Planen/Argumentieren.

6. Wiederverwenden Sie Prompts. Sparen Sie Zeit, indem Sie aufgabenspezifische Prompts teamübergreifend speichern und wiederverwenden.

Wählen Sie das richtige Copilot-Tool

Abhängig von Ihrer Aufgabe können Sie zwischen verschiedenen Copilot-Tools wählen.

Personalisieren Sie Copilot mit Anleitungsdateien

Wenn Copilot Code generiert oder Fragen beantwortet, versucht er, Ihre Codierungspraktiken und Präferenzen abzugleichen, z. B. welche Bibliotheken Sie verwenden oder wie Sie Ihre Variablen benennen. Möglicherweise verfügt er jedoch nicht immer über genügend Kontext, um dies effektiv zu tun. Wenn Sie beispielsweise mit einer bestimmten Framework-Version arbeiten, müssen Sie in Ihren Prompts zusätzlichen Kontext angeben.

Um KI-Antworten zu verbessern, können Sie Anleitungsdateien verwenden, um kontextbezogene Details zu den Codierungspraktiken, Tools oder projektspezifischen Details Ihres Teams bereitzustellen. Sie können diese Anleitungen dann an Ihren Chat-Prompt anhängen oder sie automatisch anwenden lassen.

Um Anleitungsdateien für Ihren Arbeitsbereich zu aktivieren

1. Führen Sie den Befehl Chat: Neue Anleitungsdatei über die Befehlspalette aus.

   Dieser Befehl erstellt eine Datei vom Typ .instructions.md im Ordner .github/instructions.

2. Fügen Sie Ihre Anleitungen im Markdown-Format zu der Datei hinzu. Zum Beispiel

   # Custom instructions for Copilot
   
   ## Project context
   This project is a web application built with React and Node.js.
   
   ## Indentation
   We use tabs, not spaces.
   
   ## Coding style
   Use camelCase for variable names and prefer arrow functions over traditional function expressions.
   
   ## Testing
   We use Jest for unit testing and Playwright for end-to-end testing.
   

3. Fügen Sie optional ein Glob-Muster zum Metadatenfeld applyTo hinzu, um anzugeben, für welche Dateien die Anleitungen gelten.

   ---
   applyTo: "**/*.ts"
   ---
   Coding practices for TypeScript files.
   ...
   

Erfahren Sie mehr über die Verwendung von Anleitungsdateien in VS Code.

Prompt Engineering

Sie können die Qualität der Copilot-Antworten durch effektive Prompts verbessern. Ein gut formulierter Prompt kann Copilot helfen, Ihre Anforderungen besser zu verstehen und relevantere Codevorschläge zu generieren.

• Beginnen Sie allgemein, werden Sie dann spezifisch.

  Generate a Calculator class.
  Add methods for addition, subtraction, multiplication, division, and factorial.
  Don't use any external libraries and don't use recursion.
  

• Geben Sie Beispiele für das, was Sie möchten.

  Generate a function that takes a string and returns the number of vowels in it.
  Example:
  findVowels("hello") returns 2
  findVowels("sky") returns 0
  

• Zerlegen Sie komplexe Aufgaben in einfachere Aufgaben.

  Anstatt Copilot aufzufordern, eine Mahlzeitenplaner-App zu generieren, zerlegen Sie sie in kleinere Aufgaben

  • Generieren Sie eine Funktion, die eine Liste von Zutaten nimmt und eine Liste von Rezepten zurückgibt.
  • Generieren Sie eine Funktion, die eine Liste von Rezepten nimmt und eine Einkaufsliste zurückgibt.
  • Generieren Sie eine Funktion, die eine Liste von Rezepten nimmt und einen Wochenplan zurückgibt.

• Stellen Sie den richtigen Kontext bereit, z. B. Codeauswahlen, Dateien, Terminalausgaben und mehr.

  Beispiel: Verwenden Sie die Variable #codebase, um sich auf die gesamte Codebasis zu beziehen

  Where is the database connection string used in #codebase?
  

• Iterieren Sie Ihre Prompts.

  Stellen Sie Folge-Prompts, um die Antwort zu verfeinern oder zu ändern. Zum Beispiel

  • "Schreiben Sie eine Funktion zur Berechnung der Fakultät einer Zahl."
  • "Verwenden Sie keine Rekursion und optimieren Sie durch Caching."
  • "Verwenden Sie aussagekräftige Variablennamen."

• Halten Sie den Chatverlauf relevant.

  Copilot verwendet den Verlauf des Gesprächs, um Kontext bereitzustellen. Entfernen Sie frühere Fragen und Antworten aus dem Verlauf, wenn sie nicht relevant sind. Oder starten Sie eine neue Sitzung, wenn Sie den Kontext ändern möchten.

Erfahren Sie mehr über Prompt Engineering.

Finden Sie praktische Beispiele für Prompts zur Verwendung mit Chat in der GitHub Copilot-Dokumentation.

Stellen Sie den richtigen Kontext und die richtigen Tools bereit

Reichern Sie Ihre Prompts mit relevantem Kontext an, um genauere und relevantere Antworten im Chat zu erhalten. Mit den richtigen Tools können Sie Ihre Entwicklerproduktivität steigern.

• Wählen Sie in Chat die Schaltfläche "Tools" aus, um die zu verwendenden Tools zu konfigurieren oder sie explizit zu Ihrem Prompt hinzuzufügen.
• Verwenden Sie #codebase, damit Copilot die richtigen Dateien automatisch findet, indem er eine Code-Suche durchführt.
• Verwenden Sie das Tool #fetch, um Inhalte von einer Webseite abzurufen, oder #githubRepo, um eine Code-Suche in einem GitHub-Repository durchzuführen.
• Referenzieren Sie Dateien, Ordner oder Symbole in Ihrem Prompt mit #<Dateiname>, #<Ordnername> oder #<Symbol>.
• Ziehen Sie Dateien, Ordner oder Editor-Tabs per Drag & Drop auf den Chat-Prompt.
• Fügen Sie Probleme, fehlgeschlagene Tests oder Terminalausgaben zu Ihrem Chat-Prompt hinzu, um kontextbezogene Informationen für Szenarien zu erhalten.
• Fügen Sie Bilder oder Screenshots zu Ihrem Prompt hinzu, damit Copilot das Bild analysieren kann.
• Verwenden Sie Agenten, fordern Sie eine Vorschau Ihrer App an, um sie direkt mit dem integrierten einfachen Browser zu öffnen.

Wenn Sie Agenten verwenden, findet der Agent die relevanten Dateien und den Kontext autonom für Sie.

Erfahren Sie mehr über das Hinzufügen von Kontext zu Chat-Prompts.

Wiederverwendbare Prompts

Prompt-Dateien ermöglichen es Ihnen, einen Prompt für eine bestimmte Aufgabe mit seinem Kontext und seinen Anleitungen in einer Markdown-Datei zu speichern. Sie können diesen Prompt dann im Chat anhängen und wiederverwenden. Wenn Sie den Prompt in Ihrem Arbeitsbereich speichern, können Sie ihn auch mit Ihrem Team teilen.

So erstellen Sie einen wiederverwendbaren Prompt

1. Erstellen Sie eine Prompt-Datei mit dem Befehl Chat: Neue Prompt-Datei in der Befehlspalette.

   Dieser Befehl erstellt eine Datei vom Typ .prompt.md im Ordner .github/prompts im Stammverzeichnis Ihres Arbeitsbereichs.

2. Beschreiben Sie Ihren Prompt und den relevanten Kontext im Markdown-Format.

   Verwenden Sie beispielsweise diesen Prompt, um eine neue React-Formular-Komponente zu generieren.

   Your goal is to generate a new React form component.
   
   Ask for the form name and fields if not provided.
   
   Requirements for the form:
   * Use form design system components: [design-system/Form.md](../docs/design-system/Form.md)
   * Use `react-hook-form` for form state management:
   * Always define TypeScript types for your form data
   * Prefer *uncontrolled* components using register
   * Use `defaultValues` to prevent unnecessary rerenders
   * Use `yup` for validation:
   * Create reusable validation schemas in separate files
   * Use TypeScript types to ensure type safety
   * Customize UX-friendly validation rules
   

3. Fügen Sie optional Metadaten hinzu, wie der Prompt im Chat ausgeführt werden soll. Verwenden Sie das Feld agent, um den Agenten anzugeben, und das Feld tools, um anzugeben, welche Agentenmodus-Tools verwendet werden sollen.

   ---
   agent: 'agent'
   tools: ['githubRepo', 'search/codebase']
   description: 'Generate a new React form component'
   ---
   Your goal is to generate a new React form component based on the templates in #githubRepo contoso/react-templates.
   
   Requirements for the form:
   * Use form design system components: [design-system/Form.md](../docs/design-system/Form.md)
   * Use `react-hook-form` for form state management:
   * Always define TypeScript types for your form data
   

4. Führen Sie den Befehl aus, indem Sie / gefolgt vom Namen der Prompt-Datei in das Chat-Eingabefeld eingeben.

   Geben Sie beispielsweise /new-react-form ein, um die Prompt-Datei namens new-react-form.prompt.md auszuführen.

Beginnen Sie mit Prompt-Dateien.

Wählen Sie Ihr KI-Modell

Copilot bietet verschiedene KI-Modelle zur Auswahl. Einige Modelle sind für schnelle Codierungsaufgaben optimiert, während andere besser für langsamere Planungs- und Argumentationsaufgaben geeignet sind.

Wählen Sie das Modell, das Ihren Bedürfnissen am besten entspricht, indem Sie den Modellauswahl in der Chat-Eingabeaufforderung verwenden.

Erfahren Sie mehr über KI-Modelle für Copilot Chat in der GitHub Copilot-Dokumentation.

Arbeitsbereichsindexierung

Copilot verwendet einen Index, um Ihre Codebasis schnell und genau nach relevanten Code-Snippets zu durchsuchen. Dieser Index kann entweder von GitHub gepflegt oder lokal auf Ihrem Rechner gespeichert werden.

Für GitHub-Repositorys können Sie einen Remote-Index Ihres Arbeitsbereichs verwenden, der auf GitHub-Code-Suche basiert. Dies ermöglicht Copilot, Ihre gesamte Codebasis sehr schnell zu durchsuchen, auch wenn die Codebasis sehr groß ist.

Erfahren Sie mehr über Arbeitsbereichsindexierung.

Verwandte Ressourcen

• Anleitungsleitfaden für Prompts
• Bewährte Praktiken für die Verwendung von GitHub Copilot in der GitHub Copilot-Dokumentation
• Chat in VS Code anpassen