Sehen Sie sich das neue Cookbook zur Gemini API und unser Community-Forum an.

Diese Seite wurde von der Cloud Translation API übersetzt.

Mit Pipet Code Agent einen KI-Codeassistenten erstellen

Code zu schreiben kann sowohl lohnend als auch befriedigend sein. Es ist jedoch häufig mühsam, den Code von der Arbeit in einen präsentierbaren Code für Kollegen zu verwandeln. Generative-Modelle von künstlicher Intelligenz können Ihnen helfen, Codekommentare hinzuzufügen, Fehler zu erkennen, bevor Ihre Prüfer es tun, und eine Vielzahl anderer Aufgaben ausführen, um Ihren Code-Workflow zu vereinfachen.

In dieser Anleitung erfahren Sie, wie Sie den Pipet Code Agent erweitern können, ein KI-gestütztes Codeunterstützungstool, das vom AI Developer Relations-Team bei Google entwickelt wurde. Dieses Open-Source-Projekt ist eine Erweiterung für Microsoft Visual Studio Code (VS Code), mit der Sie einige der wichtigen, aber weniger unterhaltsamen Aufgaben der Programmierung erledigen können, z. B. Code kommentieren, Fehler finden und Verbesserungen vorschlagen. Die Erweiterung sendet Anfragen zur Unterstützung bei der Programmierung an die Gemini API und fügt die Antworten in Ihr Codebearbeitungsfenster ein.

Sie können Pipet ändern, um diese vorhandenen Funktionen für Ihre Zwecke zu optimieren, oder neue Befehle erstellen, um Ihren Entwicklungsworkflow besser zu unterstützen.

Ein Video mit einem Überblick über das Projekt und wie es erweitert werden kann, einschließlich der Erkenntnisse der Entwickler, finden Sie unter AI Code Assistant – Build with Google AI. Alternativ können Sie mit dem Erweitern des Projekts beginnen, indem Sie der Anleitung unten folgen.

Projekt einrichten

In dieser Anleitung erfahren Sie, wie Sie das Pipet Code Agent-Projekt für Entwicklung und Tests einrichten. Die allgemeinen Schritte bestehen darin, erforderliche Software zu installieren, einige Umgebungsvariablen festzulegen, das Projekt aus dem Code-Repository zu klonen und die Konfigurationsinstallation auszuführen.

Erforderliche Komponenten installieren

Das Pipet Code Agent-Projekt wird als Erweiterung von Microsoft Visual Studio Code ausgeführt. Dabei werden Node.js und das npm-Tool verwendet, um Pakete zu verwalten und die Anwendung auszuführen. Die folgende Installationsanleitung bezieht sich auf einen Linux-Hostcomputer.

So installieren Sie die erforderliche Software:

Installieren Sie Visual Studio Code für Ihre Plattform.
Installieren Sie node und npm. Folgen Sie dazu der Installationsanleitung für Ihre Plattform.

Projekt klonen und konfigurieren

Laden Sie den Projektcode herunter und verwenden Sie den Installationsbefehl npm, um die erforderlichen Abhängigkeiten herunterzuladen und das Projekt zu konfigurieren. Sie benötigen die git-Versionsverwaltungssoftware, um den Projektquellcode abzurufen.

So laden Sie den Projektcode herunter und konfigurieren ihn:

Klonen Sie das Git-Repository mit dem folgenden Befehl.

git clone https://github.com/google/generative-ai-docs

Optional können Sie Ihr lokales Git-Repository für die Verwendung von Sparse Checkout konfigurieren, damit Sie nur die Dateien für das Docs-Agent-Projekt haben.
```
cd generative-ai-docs/
git sparse-checkout init --cone
git sparse-checkout set examples/gemini/node/pipet-code-agent/
```
Rufen Sie das Stammverzeichnis des Projekts des Pipet Code-Agents auf.
```
cd generative-ai-docs/examples/gemini/node/pipet-code-agent/
```
Führen Sie den Installationsbefehl aus, um Abhängigkeiten herunterzuladen und das Projekt zu konfigurieren:
```
npm install
```

Erweiterung konfigurieren und testen

Sie sollten jetzt Ihre Installation testen können. Führen Sie dazu den Pipet Code Agent als Entwicklungserweiterung in VS Code auf Ihrem Gerät aus. Durch den Test wird ein separates VS Code-Erweiterungsentwicklungs-Host-Fenster geöffnet, in dem die neue Erweiterung verfügbar ist. In diesem neuen Fenster konfigurieren Sie den API-Schlüssel, den die Erweiterung für den Zugriff auf die Google Gemini API verwendet.

Pipet-Code-Agent wird im Fenster des Extension Development Host ausgeführt Abbildung 1. Fenster „VS Code Extension Development Host“ mit den Pipet-Erweiterungsbefehlen

So konfigurieren und testen Sie Ihre Einrichtung:

Starten Sie die VS Code-Anwendung.
Erstellen Sie in VS Code ein neues Fenster, indem Sie File > New Window auswählen.
Öffnen Sie das Pipet Code Agent-Projekt. Wählen Sie dazu File > Open Folder (Datei > Ordner öffnen) und dann den Ordner pipet-code-agent/ aus.
Öffnen Sie die Datei pipet-code-agent/package.json.
Führen Sie die Erweiterung im Debug-Modus aus, indem Sie Run > Start Debugging auswählen. Dadurch wird ein separates VS Code-Fenster für den Erweiterungsentwicklungshost geöffnet.
Öffnen Sie die VS Code-Einstellungen, indem Sie Code > Einstellungen > Einstellungen auswählen.
Rufen Sie einen Google Gemini API-Schlüssel von der Website für Generative AI-Entwickler ab und kopieren Sie den Schlüsselstring.
Legen Sie den API-Schlüssel als Konfigurationseinstellung fest. Geben Sie im Feld Sucheinstellungen pipet ein und wählen Sie den Tab Nutzer aus. Klicken Sie in der Einstellung Google > Gemini: API-Schlüssel auf den Link In settings.json bearbeiten und fügen Sie Ihren Gemini API-Schlüssel hinzu:
```
"google.gemini.apiKey": "your-api-key-here"
```
Speichern Sie die Änderungen in der Datei settings.json und schließen Sie die Tabs für die Einstellungen.

So testen Sie die Erweiterungsbefehle:

Wählen Sie im Fenster Extension Development Host in VS Code einen beliebigen Code im Editorfenster aus.
Öffnen Sie die Befehlspalette über Ansicht > Befehlspalette.
Geben Sie in der Befehlspalette Pipet ein und wählen Sie einen Befehl mit diesem Präfix aus.

Vorhandenen Befehl ändern

Das Ändern der im Pipet Code Agent bereitgestellten Befehle ist die einfachste Möglichkeit, das Verhalten und die Funktionen der Erweiterung zu ändern. Sowohl für die Kommentar- als auch für die Überprüfungsbefehle wird ein weniger Shot-Prompt-Ansatz verwendet, der Code- und Kommentarbeispiele für diesen Code sowie eine allgemeine Anleitung für das generative KI-Modell enthält. Diese Kontextinformationen zu Prompts dienen dem generativen Gemini-Modell bei der Formulierung einer Antwort. Wenn Sie die Anleitung für die Eingabeaufforderung, die Beispiele oder beides in den Befehlen „Kommentieren“ oder „Überprüfen“ ändern, können Sie das Verhalten der einzelnen Befehle ändern.

In dieser Anleitung wird erläutert, wie Sie den Befehl review.ts durch Ändern des Eingabeaufforderungstexts des Befehls ändern.

So bereiten Sie die Bearbeitung des review.ts-Befehls vor:

Starten Sie die VS Code-Anwendung.
Erstellen Sie in VS Code ein neues Fenster, indem Sie File > New Window auswählen.
Öffnen Sie das Pipet Code Agent-Projekt. Wählen Sie dazu File > Open Folder (Datei > Ordner öffnen) und dann den Ordner pipet-code-agent/ aus.
Datei pipet-code-agent/src/review.ts öffnen.

So ändern Sie das Verhalten des Befehls review.ts:

Ändern Sie in der Datei review.ts den Anfang der PROMPT-Konstante in eine andere Anleitung.

const PROMPT = '
Write review comments for following code, identifying bugs and ways to improve code quality. Examples of bugs are syntax errors or typos, out of memory errors, and boundary value errors. Examples of improving code quality are reducing complexity of code, eliminating duplicate code, and ensuring other developers
are able to understand the code.
${CODE_LABEL}
...

Optional können Sie der Liste der Code- und Codebeispiele in der Datei review.ts ein weiteres Beispiel hinzufügen.

...
${REVIEW_LABEL}
There are duplicate lines of code in this control structure.
${CODE_LABEL}
const fixed_value = 128;
${REVIEW_LABEL}
Make sure constant names are in all capitals (FIXED_VALUE) for clarity.
';

Speichern Sie die Änderungen in der Datei review.ts.

So testen Sie den geänderten Befehl:

Starten Sie den Debugger im Projektfenster der VS Code Pipet-Erweiterung neu. Wählen Sie dazu Ausführen > Debugging neu starten aus.
Wählen Sie im Fenster Extension Development Host in VS Code einen beliebigen Code im Editorfenster aus.
Öffnen Sie die Befehlspalette über Ansicht > Befehlspalette.
Geben Sie in der Befehlspalette Pipet ein und wählen Sie den Befehl Pipet: Review the selected code (Ausgewählten Code überprüfen) aus.

Neuen Befehl erstellen

Sie können Pipet erweitern, indem Sie neue Befehle erstellen, die komplett neue Aufgaben mit der Gemini API ausführen. Jede Befehlsdatei (comment.ts und review.ts) ist größtenteils eigenständig und enthält Code zum Erfassen von Text aus dem aktiven Editor, zum Erstellen einer Aufforderung, zum Herstellen einer Verbindung zur Gemini API, zum Senden einer Eingabeaufforderung und zum Verarbeiten der Antwort.

Pipet-Code-Agent mit der angezeigten Auswahlfunktion „Name“ Abbildung 2. Neuer Befehl für Empfehlung zum Funktionsnamen im Fenster „Development Host für VS Code-Erweiterung“.

In dieser Anleitung wird erläutert, wie Sie einen neuen Befehl mithilfe des Codes eines vorhandenen Befehls comment.ts als Vorlage erstellen.

So erstellen Sie einen Befehl, der Namen für Funktionen empfiehlt:

Erstellen Sie eine Kopie der Datei pipet-code-agent/src/comment.ts mit dem Namen name.ts im Verzeichnis src/.
Öffnen Sie in VS Code die Datei src/name.ts.

Ändern Sie die Anleitung für die Aufforderung in der Datei name.ts, indem Sie den Wert PROMPT bearbeiten.

// Provide instructions for the AI generative model
const PROMPT = `Recommend a name for this function. Explain your
reasoning in 3 sentences or less:`;

Den Namen der Befehlsfunktion und die zugehörige Informationsnachricht ändern.

export async function generateName() {
  vscode.window.showInformationMessage('Generating function name...');

Aktualisieren Sie den Assembly-Code der Eingabeaufforderung, sodass er nur den Wert PROMPT und den im Editor ausgewählten Text enthält.
```
  // Build the full prompt using the template.
  const fullPrompt = `${PROMPT}
"
${selectedCode}
"
`;
```

Ändern Sie die Antwortausgabe, um zu beschreiben, was sie generiert.

    // update prefix to describe output
    let commentIntro = padding + commentPrefix + "Recommended name: (generated)\n";
    editBuilder.insert(selection.start, commentIntro);
    editBuilder.insert(selection.start, pyComment);

Speichern Sie die Änderungen in der Datei review.ts.

Neuen Befehl einbinden

Nachdem Sie den Code für den neuen Befehl fertiggestellt haben, müssen Sie ihn in den Rest der Erweiterung integrieren. Aktualisieren Sie die Dateien extension.ts und package.json, um den neuen Befehlsteil der Erweiterung zu erstellen, und aktivieren Sie VS Code, um den neuen Befehl aufzurufen.

So binden Sie den Befehl name in den Erweiterungscode ein:

Öffnen Sie in VS Code die Datei pipet-code-agent/src/extension.ts.
Fügen Sie der Erweiterung die neue Codedatei hinzu, indem Sie eine neue Importanweisung hinzufügen.
```
import { generateName } from './name';
```

Registrieren Sie den neuen Befehl. Fügen Sie dazu der Funktion activate() folgenden Code hinzu.

export function activate(context: vscode.ExtensionContext) {
    ...
    vscode.commands.registerCommand('pipet-code-agent.nameFunction', generateName);
}

Speichern Sie die Änderungen in der Datei extension.ts.

So binden Sie den Befehl name in das Erweiterungspaket ein:

Öffnen Sie in VS Code die Datei pipet-code-agent/package.json.

Fügen Sie den neuen Befehl dem Abschnitt commands der Paketdatei hinzu.

  "contributes": {
    "commands": [
      ...
      {
        "command": "pipet-code-agent.nameFunction",
        "title": "Pipet: Name the selected function."
      }
    ],

Speichern Sie die Änderungen in der Datei package.json.

Neuen Befehl testen

Nachdem Sie den Befehl codiert und in die Erweiterung integriert haben, können Sie ihn testen. Der neue Befehl ist nur im Fenster Extension Development Host in VS Code verfügbar und nicht im VS Code-Fenster, in dem Sie den Code für die Erweiterung bearbeitet haben.

So testen Sie den geänderten Befehl:

Starten Sie den Debugger im Projektfenster der VS Code Pipet-Erweiterung neu. Wählen Sie dazu Ausführen > Debugging neu starten aus. Dadurch wird ein separates Fenster für den Erweiterungsentwicklungshost neu gestartet.
Wählen Sie im Fenster Extension Development Host in VS Code einen Code im Editorfenster aus.
Öffnen Sie die Befehlspalette über Ansicht > Befehlspalette.
Geben Sie in der Befehlspalette Pipet ein und wählen Sie den Befehl Pipet: Name the selected function (Ausgewählte Funktion benennen) aus.

Zusätzliche Ressourcen

Weitere Informationen zum Pipet Code Agent-Projekt finden Sie im Code-Repository. Wenn Sie Hilfe beim Erstellen der Anwendung benötigen oder mit dem Entwickler zusammenarbeiten möchten, besuchen Sie den Server der Google Developers-Community Discord.

Produktionsanwendungen

Wenn Sie den Docs-Agent für eine große Zielgruppe bereitstellen möchten, beachten Sie bitte, dass die Verwendung der Google Gemini API möglicherweise Ratenbegrenzungen und anderen Nutzungsbeschränkungen unterliegt. Wenn Sie mit der Gemini API wie Docs Agent eine Produktionsanwendung erstellen möchten, sollten Sie sich die Google Cloud Vertex AI-Dienste ansehen, die die Skalierbarkeit und Zuverlässigkeit Ihrer Anwendung verbessern.