Entdecken Sie agentenbasierte Entwicklung –

Der Open-Source-KI-Code-Editor

Ihr Zuhause für Multi-Agenten-Entwicklung

Visual Studio Code herunterladen

Durch die Nutzung von VS Code stimmen Sie der Lizenz und der Datenschutzerklärung zu.

Interaktives Hero-Element, das die Visual Studio Code-Oberfläche mit Agenten-Sitzungen, Beispiel-Tabs und Copilot-Chat zeigt; nutzen Sie die Navigation, um den Editor-Inhalt zu erkunden.
Agent-Sitzungen
Lokaler Chat-Agent Refactoring der MailList-Komponentenstruktur GitHub Copilot Cloud-Agent MailListItem in eigenständige Komponente extrahieren 10 Min #1
+42 -24
GitHub Copilot CLI-Agent CLI-Agenten-Sitzung starten
MailList.tsx MailListItem.tsx MailListItem in eigenständige Komponente extrahieren
import { For, createSignal, createMemo } from "solid-js";
import { useNavigate, useParams } from "@tanstack/solid-router";
import { getEmailsForMailbox } from "~/data/emails";
import { MailListItem } from "~/components/MailListItem";

export function MailList() {
  const params = useParams({ strict: false }) as {
    mailbox?: string;
    id?: string;
  };
  const navigate = useNavigate();
  const [query, setQuery] = createSignal("");
  const mailbox = () => params.mailbox || "inbox";
  const list = createMemo(() => {
    const q = query().toLowerCase();
    return getEmailsForMailbox(mailbox()).filter(
      (e) =>
        !q ||
        e.subject.toLowerCase().includes(q) ||
        e.snippet.toLowerCase().includes(q)
    );
  });
  function open(id: string) {
    navigate({
      to: "/mail/$mailbox/$id",
      params: { mailbox: mailbox(), id },
      search: (prev) => prev,
    });
  }

  return (
    <For each={list()}>
      {(e) => (
        <div
          role="listitem"
          tabindex={0}
          onClick={() => open(e.id)}
          onKeyDown={(ev) => ev.key === "Enter" && open(e.id)}
          class="mail-item"
          data-selected={params.id === e.id ? "true" : undefined}
          aria-selected={params.id === e.id ? "true" : undefined}
        >
          <div>
            <div class="mail-item-subject truncate">{e.subject}</div>
            <div class="mail-item-snippet truncate">{e.snippet}</div>
          </div>
          <time
            class="text-xs muted"
            datetime={e.date}
            title={new Date(e.date).toLocaleString()}
          >
            {new Date(e.date).toLocaleDateString(undefined, {
              month: "short",
              day: "numeric",
            })}
          </time>
        </div>
        <MailListItem
          email={e}
          isSelected={params.id === e.id}
          onOpen={open}
        />
      )}
    </For>
  );
}
Chat
Bitte aktualisieren Sie die MailList-Komponente, um E-Mail-Listenelemente in eine eigene, eigenständige Komponente zu abstrahieren GitHub Copilot Cloud-Agent An Cloud-Agent delegieren Der Agent arbeitet asynchron, um einen Pull Request mit den angeforderten Änderungen zu erstellen. kenzi.lawson avatar kenzi.lawson"Delegieren" ausgewählt GitHub Copilot Cloud-Agent [WIP] Refactor MailList, um E-Mail-Listenelemente zu abstrahieren - Copilot Cloud-Agent hat mit der Arbeit an "Bitte aktualisieren Sie die Mail..." begonnen und wird diesen Pull Request aktualisieren, sobald Fortschritte erzielt werden. Bitte aktualisieren Sie die MailList-Komponente, um einzelne E-Mail-Listenelemente in ihre eigene Komponente zu abstrahieren. Erstellt von VS Code über die GitHub Pull Request-Erweiterung. ✨ Lassen Sie den Copilot-Coding-Agent die Einrichtung für Sie übernehmen – der Coding-Agent arbeitet schneller und liefert eine höhere Qualität, wenn er für Ihr Repository konfiguriert ist. Der GitHub Copilot Cloud-Agent hat mit der Bearbeitung Ihrer Anfrage begonnen. Verfolgen Sie den Fortschritt im zugehörigen Chat und Pull Request. MailList.tsx
Beschreiben Sie, was als Nächstes erstellt werden soll
Agent Claude Opus 4.6

Agenten, die für Sie bauen

Übergeben Sie Aufgaben an KI-Agenten, die autonom planen, Codeänderungen vornehmen, Befehle ausführen und iterieren, bis die Arbeit erledigt ist.

Beauftragen Sie zum Beispiel einen CLI-basierten Agenten mit dem Sichten und Beheben von Fehlern im Hintergrund, interagieren Sie mit einem anderen Agenten, um ein Feature unter Verwendung von Live-Validierung im integrierten Browser zu implementieren, und delegieren Sie ein Homepage-Redesign an einen Cloud-Agenten, der einen Pull Request für Ihr Team zur Überprüfung öffnet.

Erste Schritte mit Agenten
Interaktive Agenten-Demo mit VS Code-Tabs, Seitenleisten und Chat-Interaktionen; nutzen Sie die Standard-Tastaturnavigation, um jeden Bereich zu erkunden.
batch.go processor.go image_processor_test.go health.go main.go
package http

import (
    "io"
    "log/slog"
    "mime/multipart"
    "net/http"
    "strings"
)

type BatchItemResult struct {
    Name string `json:"name"`
    Metadata *struct {
        Format string `json:"format"`
        Width  int    `json:"width"`
        Height int    `json:"height"`
        Bytes  int    `json:"bytes"`
    } `json:"metadata,omitempty"`
    Error string `json:"error,omitempty"`
}

type BatchResponse struct {
    Results []*BatchItemResult `json:"results"`
    Count   int                `json:"count"`
    Success int                `json:"success"`
    Failed  int                `json:"failed"`
}

// handleProcessBatch processes multiple uploaded images (multipart/form-data) under the field name "files".
// It returns metadata for each image or an error per item without failing the whole batch unless the request is malformed.
func (s *Server) handleProcessBatch(w http.ResponseWriter, r *http.Request) {
    // Enforce max body size overall.
    r.Body = http.MaxBytesReader(w, r.Body, s.cfg.MaxUploadBytes)
    if ct := r.Header.Get("Content-Type"); !strings.HasPrefix(ct, "multipart/form-data") {
        s.writeJSON(w, http.StatusBadRequest, map[string]string{"error": "content type must be multipart/form-data"})
        return
    }
    if err := r.ParseMultipartForm(s.cfg.MaxUploadBytes); err != nil {
        status := http.StatusBadRequest
        if strings.Contains(err.Error(), "request body too large") {
            status = http.StatusRequestEntityTooLarge
        }
        s.writeJSON(w, status, map[string]string{"error": "invalid multipart form: " + err.Error()})
        return
    }

    // Accept files under the key "files". If absent, attempt to fallback to any file parts.
    var fileHeaders []*multipart.FileHeader
    if r.MultipartForm != nil && len(r.MultipartForm.File["files"]) > 0 {
        fileHeaders = r.MultipartForm.File["files"]
    } else if r.MultipartForm != nil {
        // Fallback: gather all files across keys.
        for _, fhs := range r.MultipartForm.File {
            fileHeaders = append(fileHeaders, fhs...)
        }
    }

    if len(fileHeaders) == 0 {
        s.writeJSON(w, http.StatusBadRequest, map[string]string{"error": "no files provided (expect key 'files')"})
        return
    }

    resp := &BatchResponse{Results: make([]*BatchItemResult, 0, len(fileHeaders))}

    for _, fh := range fileHeaders {
        item := &BatchItemResult{Name: fh.Filename}
        f, err := fh.Open()
        if err != nil {
            item.Error = "open file: " + err.Error()
            resp.Results = append(resp.Results, item)
            resp.Failed++
            continue
        }
        data, err := io.ReadAll(f)
        _ = f.Close()
        if err != nil {
            item.Error = "read file: " + err.Error()
            resp.Results = append(resp.Results, item)
            resp.Failed++
            continue
        }
        meta, err := s.proc.ExtractMetadata(data)
        if err != nil {
            item.Error = err.Error()
            resp.Results = append(resp.Results, item)
            resp.Failed++
            continue
        }
        // Copy into anonymous struct to decouple from internal type if it changes.
        item.Metadata = &struct {
            Format string `json:"format"`
            Width  int    `json:"width"`
            Height int    `json:"height"`
            Bytes  int    `json:"bytes"`
        }{Format: meta.Format, Width: meta.Width, Height: meta.Height, Bytes: meta.Bytes}
        resp.Results = append(resp.Results, item)
        resp.Success++
    }

    resp.Count = len(resp.Results)
    s.log.LogAttrs(r.Context(), slog.LevelInfo, "batch processed", slog.Int("count", resp.Count), slog.Int("success", resp.Success), slog.Int("failed", resp.Failed))
    s.writeJSON(w, http.StatusOK, resp)
}
Copilot Claude Code Claude Code Codex Codex Cline Cline Gemini Gemini Chat
Ich baue einen Bildverarbeitungsdienst. Können Sie bitte einen neuen Endpunkt erstellen, der Unterstützung für die Stapelbildverarbeitung implementiert?
Erstellen einer Todo-Liste Ich beginne mit der Erstellung der Todo-Liste und verwalte Aufgaben wie das Lesen des vorhandenen Server- und Prozessorcodes, den Entwurf des Batch-Endpunkt-Vertrags und die Implementierung einer neuen Datei mit einem Handler. Ich möchte den Handler in die Serverrouten einbinden und vielleicht einen minimalen Test für den Batch-Endpunkt hinzufügen, obwohl das optional ist. Ich plane auch, danach Tests auszuführen und alles zu bauen. Lassen Sie uns das ausführen!
Erstellung einer strukturierten Todo-Liste für die Implementierung des Batch-Bildverarbeitungs-Endpunkts. 7 Todos erstellt Lesen der Kerndateien, um die aktuelle Server- und Bildverarbeitungsimplementierung zu verstehen, bevor der Batch-Endpunkt hinzugefügt wird. Lesenserver.go Lesenprocessor.go Lesenlogging.go Lesenhealth.go
Verbesserung der Dateiverarbeitung... Ich könnte server.go modifizieren, aber es wurde nach einer neuen Datei gefragt. Also muss ich eine Route erstellen, nennen wir sie /process/batch. Ich werde eine maximale Body-Größe erzwingen und sicherstellen, dass der Content-Type multipart/form-data ist. Als Nächstes werde ich das Formular parsen und über form.File["files"] iterieren. Für jeden FileHeader werde ich ihn öffnen und die Bytes lesen, dann ExtractMetadata aufrufen, um Ergebnisse zu sammeln. Abschließend werde ich eine strukturierte JSON-Antwort mit Ergebnissen zurückgeben und Sonderfälle für fehlende Dateien und maximale Batch-Limits behandeln. Ich denke, es ist vielleicht nicht unbedingt nötig, aber ich erwäge eine kleine Verbesserung durch die Verwendung von sync.WaitGroup, um jede Datei sequenziell zu verarbeiten, während die Parallelität begrenzt wird. Dies würde den ersten Commit einfacher machen. Ich muss die Codedatei hinzufügen und den internen Alias für die Bildreferenz importieren. Als Nächstes werde ich mir die vorhandenen Tests in tests/image_processor_test.go ansehen, um den Stil zu erkennen und festzustellen, ob ich eine neue Testdatei für den Batch-Handler erstellen sollte. Ich werde das durchlesen und dann die Todo-Status aktualisieren, wobei ich Aufgabe eins und zwei als abgeschlossen markiere.
Lesen vorhandener Tests, um den Stil zu spiegeln, bevor der Batch-Endpunkt hinzugefügt wird; anschließend fahre ich mit Entwurf und Implementierung fort. Lesenimage_processor_test.go
Vorbereitung auf HTTP-Test Ich muss einen HTTP-Test ausführen, aber ich bemerke, dass das aktuelle Testpaket in 'tests' liegt und nicht innerhalb der Hauptmodule. Um den HTTP-Test durchzuführen, muss ich einige Dinge wie Konfiguration, Prozessor, Logger und Server einrichten sowie eine Multipart-Anfrage senden. Mein nächster Schritt ist es, die Konfiguration in config.go zu prüfen, um zu verstehen, welche Pflichtfelder ich aufnehmen muss. Lassen Sie uns das angehen!
Lesen der Konfiguration, um den Server im HTTP-Test aufzubauen. Lesenconfig.go
Verwaltung von Updates und Patches Ich muss die manage_todo_list verwenden, um alles organisiert zu halten und sicherzustellen, dass ich keine Aufgabe aus den Augen verliere. Sobald das erledigt ist, kann ich mit dem Anwenden des Patches fortfahren. Dies beinhaltet das Hinzufügen einer neuen Datei und Bearbeitungen an server.go. Ich möchte sicherstellen, dass während dieses Prozesses alles klar und präzise ist, um Fehler zu vermeiden. Lassen Sie uns weitermachen!
Start (3/7) Batch-Vertrag entwerfen
Implementierung von Updates und Tests Ich markiere den Entwurfsvertrag als abgeschlossen und muss nun die Updates implementieren. Ich werde mit der Verwaltung der Todo-Liste fortfahren und den Patch anwenden, um eine Datei hinzuzufügen und server.go zu aktualisieren. Es scheint, als müsste ich eine Route für /process/batch in server.go hinzufügen und eine neue Datei internal/http/batch.go implementieren. Nach dem Schreiben des Codes werde ich eine Testdatei hinzufügen, die Tests mit go test ausführen und run_in_terminal-Befehle verwenden. Packen wir es an!
Abgeschlossen (3/7) Batch-Vertrag entwerfen Patch anwenden, um Batch-Handler, Route und Test hinzuzufügen. server.go+1 -0 batch.go+106 -0 batch_endpoint_test.go+123 -0 Einen neuen Batch-Bildverarbeitungs-Endpunkt implementiert Dateien geändert / hinzugefügt
  • server.go: Neue Route POST /process/batch registriert.
  • batch.go: Neuer Handler handleProcessBatch, der
    • multipart/form-data akzeptiert.
    • Mehrere Dateien unter dem Key 'files' liest (Rückgriff auf beliebige Dateiteile, falls 'files' fehlt).
    • Erfolg/Fehler pro Datei zurückgibt, ohne den gesamten Batch fehlschlagen zu lassen.
    • Zählwerte aggregiert: Anzahl, Erfolg, fehlgeschlagen.
  • batch_endpoint_test.go: Testet den Happy-Path (1 gültige + 1 ungültige Datei) und den Fehlerfall bei fehlenden Dateien.
Vorgeschlagene nächste Schritte (optional)
  • Hinzufügen einer konfigurierbaren maximalen Anzahl von Dateien pro Batch (z. B. über Konfiguration).
  • Stream-Verarbeitung mit begrenztem Speicher (verarbeiten + verwerfen) für sehr große Bilder.
  • Optionale Parallelität mit einem Worker-Pool und Kontextabbruch.
  • Größenvalidierung pro Datei vor der Dekodierung hinzufügen.
  • Unterstützung für JSON-basiertes Batching (URLs oder Base64) für Nicht-Multipart-Clients.
Lassen Sie mich wissen, ob Sie eine dieser Verbesserungen wünschen oder ein anderes Anfrage-/Antwortformat bevorzugen.
batch.go
Beschreiben Sie, was als Nächstes erstellt werden soll
Agent Gemini 3 Pro (Vorschau)

Jeder Agent, jedes Modell

Nutzen Sie das Agenten-Framework, das zu Ihrem Workflow passt. Führen Sie Agenten lokal oder in der Cloud aus, mit Copilot oder Drittanbietern wie Claude und OpenAI.

Wählen Sie aus Dutzenden von Modellen verschiedener Anbieter, von schnellen Vervollständigungsmodellen bis hin zu fortschrittlichen Denkmodellen. Oder bringen Sie Ihren eigenen Schlüssel mit, um jedes Modell von jedem Anbieter zu verwenden.

Alle Ihre Sitzungen, eine Ansicht

Bleiben Sie produktiv, während mehrere Agenten parallel an Aufgaben arbeiten. Verfolgen Sie alle Ihre Agentensitzungen in einer einzigen Ansicht, unabhängig davon, wo sie ausgeführt werden.

Filtern und überwachen Sie Sitzungen schnell oder tauchen Sie in eine einzelne Agenteninteraktion ein, ohne das Tool oder Terminal zu wechseln.

Ihre Regeln, Ihre Agenten

Stellen Sie sicher, dass Agenten Ihre Praktiken und Team-Workflows befolgen. Definieren Sie benutzerdefinierte Anweisungen, fügen Sie Agenten-Fähigkeiten hinzu oder erstellen Sie benutzerdefinierte Agenten, die auf Ihr Projekt zugeschnitten sind.

Verbinden Sie sich mit externen Tools und Diensten über MCP-Server oder installieren Sie Agenten-Plugins oder Erweiterungen, um die Fähigkeiten des Agenten zu erweitern.

Starten Sie kostenlos mit KI-Agenten

Keine Testversion. Keine Kreditkarte erforderlich. Nur Ihr GitHub-Konto.

Kostenlos ausprobieren

Ein erstklassiger Code-Editor im Kern

VS Code ist seit über einem Jahrzehnt der Editor der Wahl für Millionen von Entwicklern. KI-gestützte Inline-Vorschläge, intelligente Vervollständigungen und eine reichhaltige Bearbeitungserfahrung machen es genauso leistungsfähig, wenn Sie den Code selbst schreiben.

Wechseln Sie nahtlos zwischen der Arbeit mit Agenten und manuellem Programmieren, alles innerhalb desselben Editors.

Erste Schritte mit VS Code
main.py
import numpy as np
import pandas as pd

iris_data = pd.read_csv("iris_dataset.csv")

def describe(species: str) -> pd.Series:
7
subset = data[data["species"] == species]           subset = iris_data[iris_data["species"] == species] if subset.empty: raise ValueError(f"{species} missing from sample") return subset[["petal", "sepal"]].agg(["mean", "std"]).loc["mean"] def summary():
13
for species in np.sort(data["species"].unique()):      for species in np.sort(iris_data["species"].unique()): try: stats = describe(species) except ValueError: print(f"{species}: no records") continue print(f"{species}: petal={stats['petal']:.2f} sepal={stats['sepal']:.2f}") if __name__ == "__main__": summary()

Programmieren in jeder Sprache

VS Code unterstützt fast jede wichtige Programmiersprache. Einige sind direkt enthalten, wie JavaScript, TypeScript, CSS und HTML, aber Erweiterungen für andere finden Sie im VS Code Marketplace.

JavaScript-SymbolJavaScript
TypeScript-SymbolTypeScript
Python-SymbolPython
C#-SymbolC#
C++-SymbolC++
HTML-SymbolHTML
Java-SymbolJava
JSON-SymbolJSON
PHP-SymbolPHP
Markdown-SymbolMarkdown
Powershell-SymbolPowershell
YAML-SymbolYAML

Vollständig anpassbar

Passen Sie Ihre VS Code-Benutzeroberfläche und Ihr Layout an Ihren Programmierstil an.

Farbthemen ermöglichen es Ihnen, die Farben in der Benutzeroberfläche von VS Code an Ihre Vorlieben und Arbeitsumgebung anzupassen.

Settings Sync ermöglicht es Ihnen, Ihre Benutzereinstellungen mit der Funktion "Settings Sync" über Ihre VS Code-Instanzen hinweg zu teilen.

Profile lassen Sie Sätze von Anpassungen erstellen und schnell zwischen ihnen wechseln oder sie mit anderen teilen.

Selecting the GitHub Dark theme with a quick pick Selecting the GitHub Dark theme with a quick pick

Programmieren überall

Programmieren Sie, wo immer Sie am produktivsten sind, egal ob Sie mit der Cloud verbunden sind, einem Remote-Repository oder im Browser mit VS Code for the Web (vscode.dev).

Integrierte Quellcodeverwaltung bietet Ihnen Git-Unterstützung direkt aus der Box. Viele andere Anbieter von Quellcodeverwaltung sind über Erweiterungen verfügbar.

GitHub Codespaces bietet Cloud-basierte Entwicklungsumgebungen für jede Aktivität – sei es ein langfristiges Projekt oder eine kurzfristige Aufgabe wie das Überprüfen eines Pull Requests.

vscode.dev in an Edge browser tab vscode.dev in an Edge browser tab

Mit reichhaltigen Funktionen codieren

Ein Editor ist mehr als nur das. Egal, ob Sie integrierte Funktionen oder umfangreiche Erweiterungen nutzen, es ist für jeden etwas dabei.

© . This website operates independently and is not affiliated with or endorsed by Microsoft. All brand names, logos, and trademarks are the property of their respective owners.