ist jetzt verfügbar! Lesen Sie über die neuen Funktionen und Fehlerbehebungen vom November.

Grundlegende Bearbeitung

Visual Studio Code ist in erster Linie ein Editor und bietet die Funktionen, die Sie für eine hocheffiziente Quellcodebearbeitung benötigen. Dieses Thema führt Sie durch die Grundlagen des Editors und hilft Ihnen beim Einstieg in Ihren Code.

Tastenkombinationen

Es ist entscheidend für hohe Produktivität, die Hände beim Schreiben von Code auf der Tastatur zu behalten. VS Code verfügt über eine reichhaltige Sammlung von Tastenkombinationen sowie die Möglichkeit, diese anzupassen.

  • Referenz der Tastenkombinationen – Lernen Sie die am häufigsten verwendeten und beliebtesten Tastenkombinationen kennen, indem Sie das Referenzblatt herunterladen.
  • Keymap-Erweiterung installieren – Verwenden Sie die Tastenkombinationen Ihres alten Editors (z. B. Sublime Text, Atom und Vim) in VS Code, indem Sie eine Keymap-Erweiterung installieren.
  • Tastenkombinationen anpassen – Ändern Sie die Standardtastenkombinationen, um sie an Ihren Stil anzupassen.

Mehrfachauswahl (Multi-Cursor)

VS Code unterstützt mehrere Cursor für schnelle, gleichzeitige Bearbeitungen. Sie können sekundäre Cursor (dünner dargestellt) mit Alt+Klick hinzufügen. Jeder Cursor arbeitet unabhängig basierend auf dem Kontext, in dem er sich befindet. Eine gängige Methode, weitere Cursor hinzuzufügen, ist die Verwendung von ⌥⌘↓ (Windows Ctrl+Alt+Down, Linux Shift+Alt+Down) oder ⌥⌘↑ (Windows Ctrl+Alt+Up, Linux Shift+Alt+Up), die Cursor darunter bzw. darüber einfügen.

Hinweis

Ihr Grafikkartentreiber (z. B. NVIDIA) überschreibt möglicherweise diese Standardkombinationen.

Multi-cursor

⌘D (Windows, Linux Ctrl+D) wählt das Wort am Cursor aus oder die nächste Übereinstimmung der aktuellen Auswahl aus.

Tipp

Sie können die nächste übereinstimmende Instanz beim Verwenden der Multi-Cursor-Suche überspringen, indem Sie ⌘K ⌘D (Windows, Linux Ctrl+K Ctrl+D) ausführen. Dies hilft Ihnen, ungewollte Auswahlen zu vermeiden, wenn Sie wiederholten Text bearbeiten.

Multi-cursor-next-word

Tipp

Sie können auch weitere Cursor mit ⇧⌘L (Windows, Linux Ctrl+Shift+L) hinzufügen, was an jeder Stelle der aktuell ausgewählten Textpassage eine Auswahl hinzufügt.

Multi-Cursor-Modifikator

Wenn Sie die Modifikatortaste für das Anwenden mehrerer Cursor auf Cmd+Klick unter macOS und Ctrl+Klick unter Windows und Linux ändern möchten, können Sie dies mit der Einstellung editor.multiCursorModifier tun. Dies ermöglicht es Benutzern, die von anderen Editoren wie Sublime Text oder Atom kommen, weiterhin den ihnen vertrauten Tastaturmodifikator zu verwenden.

Die Einstellung kann auf Folgendes gesetzt werden:

  • ctrlCmd - Entspricht Strg unter Windows und Cmd unter macOS.
  • alt - Das bestehende Standard- Alt.

Es gibt auch einen Menüpunkt **Auswahl** > **Zu Strg+Klick für Multi-Cursor wechseln** oder **Auswahl** > **Zu Alt+Klick für Multi-Cursor wechseln**, um diese Einstellung schnell umzuschalten.

Die Geste **Gehe zu Definition** und **Link öffnen** respektiert ebenfalls diese Einstellung und passt sich an, sodass sie nicht kollidieren. Wenn die Einstellung beispielsweise auf ctrlCmd gesetzt ist, können mehrere Cursor mit Strg/Cmd+Klick hinzugefügt werden, und das Öffnen von Links oder das Gehen zu Definitionen kann mit Alt+Klick ausgelöst werden.

Auswahl verkleinern/vergrößern

Verkleinern oder vergrößern Sie die aktuelle Auswahl schnell. Lösen Sie sie mit ⌃⇧⌘← (Windows, Linux Shift+Alt+Links) und ⌃⇧⌘→ (Windows, Linux Shift+Alt+Rechts) aus.

Hier ist ein Beispiel für das Vergrößern der Auswahl mit ⌃⇧⌘→ (Windows, Linux Shift+Alt+Rechts)

Expand selection

Spaltenauswahl (Box-Auswahl)

Platzieren Sie den Cursor in einer Ecke und halten Sie dann Shift+Alt gedrückt, während Sie zur gegenüberliegenden Ecke ziehen

Column text selection

Hinweis

Dies ändert sich zu Umschalt+Strg/Cmd, wenn Strg/Cmd als Multi-Cursor-Modifikator verwendet wird.

Es gibt auch Standard-Tastenkombinationen für die Spaltenauswahl unter macOS und Windows, aber nicht unter Linux.

Taste Befehl Befehls-ID
⇧↓ (Windows, Linux Umschalt+Unten) Spalte nach unten auswählen cursorColumnSelectDown
⇧↑ (Windows, Linux Umschalt+Oben) Spalte nach oben auswählen cursorColumnSelectUp
⇧← (Windows, Linux Umschalt+Links) Spalte nach links auswählen cursorColumnSelectLeft
⇧→ (Windows, Linux Umschalt+Rechts) Spalte nach rechts auswählen cursorColumnSelectRight
⇧PageDown (Windows, Linux Umschalt+Bild runter) Spalte Seite runter auswählen cursorColumnSelectPageDown
⇧PageUp (Windows, Linux Umschalt+Bild auf) Spalte Seite auf auswählen cursorColumnSelectPageUp

Sie können Ihre keybindings.json bearbeiten, um sie bei Bedarf an etwas Vertrautes zu binden.

Spaltenauswahlmodus

Die Benutzereinstellung **Editor: Spaltenauswahl** steuert diese Funktion. Sobald dieser Modus aktiviert ist, wie in der Statusleiste angegeben, erstellen die Mausgesten und die Pfeiltasten standardmäßig eine Spaltenauswahl. Dieser globale Schalter ist auch über den Menüpunkt **Auswahl** > **Spaltenauswahlmodus** zugänglich. Darüber hinaus kann der Spaltenauswahlmodus auch über die Statusleiste deaktiviert werden.

Speichern / Autosave

Standardmäßig erfordert VS Code eine explizite Aktion, um Ihre Änderungen auf der Festplatte zu speichern, ⌘S (Windows, Linux Strg+S).

Es ist jedoch einfach, Auto Save zu aktivieren, was Ihre Änderungen nach einer konfigurierten Verzögerung oder wenn der Fokus den Editor verlässt, speichert. Wenn diese Option aktiviert ist, ist kein explizites Speichern der Datei erforderlich. Der einfachste Weg, Auto Save zu aktivieren, ist die Umschaltfunktion **Datei** > **Auto Save**, die das Speichern nach einer Verzögerung ein- und ausschaltet.

Für mehr Kontrolle über Auto Save, öffnen Sie Ihre Benutzer- oder Arbeitsbereichseinstellungen und suchen Sie die zugehörigen Einstellungen

  • files.autoSave: Kann die Werte haben
    • off - zum Deaktivieren von Auto Save.
    • afterDelay - zum Speichern von Dateien nach einer konfigurierten Verzögerung (Standard 1000 ms).
    • onFocusChange - zum Speichern von Dateien, wenn der Fokus von der schmutzigen Datei weggeht.
    • onWindowChange - zum Speichern von Dateien, wenn der Fokus das VS Code-Fenster verlässt.
  • files.autoSaveDelay: Konfiguriert die Verzögerung in Millisekunden, wenn files.autoSave auf afterDelay eingestellt ist. Der Standardwert ist 1000 ms.

Wenn Sie die Funktionalität von Auto Save für bestimmte Sprachen oder Dateitypen anpassen möchten, können Sie dies über die Datei settings.json tun, indem Sie sprachspezifische Regeln hinzufügen.

Zum Beispiel, um Auto Save für LaTeX-Dateien zu deaktivieren

    "[latex]": {
        "files.autoSave": "off",
    },

Hot Exit

Standardmäßig merkt sich VS Code ungespeicherte Änderungen an Dateien, wenn Sie das Programm beenden. Hot Exit wird ausgelöst, wenn die Anwendung über **Datei** > **Beenden** (**Code** > **Beenden** unter macOS) geschlossen wird oder wenn das letzte Fenster geschlossen wird.

Sie können Hot Exit konfigurieren, indem Sie files.hotExit auf die folgenden Werte setzen

  • "off": Hot Exit deaktivieren.
  • "onExit": Hot Exit wird beim Schließen der Anwendung ausgelöst, d. h. beim Schließen des letzten Fensters unter Windows/Linux oder beim Auslösen des Befehls workbench.action.quit (aus der **Befehlspalette**, Tastenkombination oder Menü). Alle Fenster ohne geöffnete Ordner werden beim nächsten Start wiederhergestellt.
  • "onExitAndWindowClose": Hot Exit wird beim Schließen der Anwendung ausgelöst, d. h. beim Schließen des letzten Fensters unter Windows/Linux oder beim Auslösen des Befehls workbench.action.quit (aus der **Befehlspalette**, Tastenkombination oder Menü), sowie für jedes Fenster mit einem geöffneten Ordner, unabhängig davon, ob es das letzte Fenster ist. Alle Fenster ohne geöffnete Ordner werden beim nächsten Start wiederhergestellt. Um Ordnerfenster so wiederherzustellen, wie sie vor dem Herunterfahren waren, setzen Sie window.restoreWindows auf all.

Wenn bei Hot Exit etwas schief geht, werden alle Backups an den folgenden Speicherorten für Standardinstallationen gespeichert

  • Windows %APPDATA%\Code\Backups
  • macOS $HOME/Library/Application Support/Code/Backups
  • Linux $HOME/.config/Code/Backups

Suchen und Ersetzen

VS Code ermöglicht es Ihnen, Text in der aktuell geöffneten Datei schnell zu finden und zu ersetzen. Drücken Sie ⌘F (Windows, Linux Strg+F), um das Suchfeld im Editor zu öffnen und den Suchbegriff einzugeben. Die Suchergebnisse werden im Editor, im Übersichtsbalken und in der Minimap hervorgehoben.

VS Code beginnt sofort mit der Suche, während Sie tippen. Um die Suche erst zu starten, wenn Sie die Eingabetaste drücken, löschen Sie die Einstellung editor.find.findOnType.

Wenn es mehrere Übereinstimmungen in der aktuellen Datei gibt, drücken Sie die Eingabetaste, um zum nächsten Ergebnis zu gelangen, oder Umschalt+Eingabetaste (Windows, Linux Umschalt+Eingabetaste), um zum vorherigen Ergebnis zu gelangen, während sich der Fokus auf dem Suchfeld befindet.

Standardmäßig speichert VS Code den Verlauf Ihrer Such- und Ersetzungsanfragen für einen Arbeitsbereich und stellt ihn nach Neustarts wieder her. Sie können dieses Verhalten mit den Einstellungen editor.find.history und editor.find.replaceHistory konfigurieren. Setzen Sie den Wert auf never, um das Speichern des Verlaufs zu deaktivieren.

Suchbegriff aus Auswahl übernehmen

Wenn das Suchfeld geöffnet wird, wird der ausgewählte Text im Editor automatisch in das Suchfeld übernommen. Wenn die Auswahl leer ist, wird stattdessen das Wort unter dem Cursor in das Eingabefeld eingefügt.

Seed Search String From Selection

Diese Funktion kann ausgeschaltet werden, indem editor.find.seedSearchStringFromSelection auf "never" gesetzt wird.

In Auswahl suchen

Standardmäßig werden die Suchvorgänge auf die gesamte Datei im Editor angewendet. Um die Suche auf den ausgewählten Text zu beschränken, klicken Sie auf das Symbol **In Auswahl suchen** im Suchfeld oder drücken Sie ⌥⌘L (Windows, Linux Alt+L).

Find In Selection

Wenn Sie dies zum Standardverhalten des Suchfelds machen möchten, können Sie editor.find.autoFindInSelection auf always setzen, oder auf multiline, wenn es nur bei ausgewählten Texten mit mehreren Zeilen ausgeführt werden soll.

Erweiterte Such- und Ersetzungsoptionen

Für erweiterte Szenarien bietet das Such- und Ersetzungsfeld folgende Optionen

  • Suchfeld

    • Groß-/Kleinschreibung beachten
    • Ganzes Wort suchen
    • Regulärer Ausdruck
  • Ersetzungsfeld

    • Groß-/Kleinschreibung beibehalten

Advanced Find and Replace Options

Unterstützung für mehrere Zeilen und Größenanpassung des Suchfelds

Sie können mehrzeiligen Text suchen, indem Sie den Text in das Suchfeld und das Ersetzungsfeld einfügen. Das Drücken von Strg+Eingabetaste fügt eine neue Zeile in das Eingabefeld ein.

Multiple Line Support

Beim Suchen von langem Text ist die Standardgröße des Suchfelds möglicherweise zu klein. Sie können den linken Schieberegler ziehen, um das Suchfeld zu vergrößern, oder doppelklicken Sie auf den linken Schieberegler, um es zu maximieren oder auf die Standardgröße zu verkleinern.

Resize Find control

Durch Dateien suchen

VS Code ermöglicht es Ihnen, schnell in allen Dateien des aktuell geöffneten Ordners zu suchen. Drücken Sie ⇧⌘F (Windows, Linux Strg+Umschalt+F) und geben Sie Ihren Suchbegriff ein. Suchergebnisse werden in Dateien gruppiert, die den Suchbegriff enthalten, mit Angabe der Treffer in jeder Datei und ihrer Position. Erweitern Sie eine Datei, um eine Vorschau aller Treffer innerhalb dieser Datei anzuzeigen. Klicken Sie dann einmal auf einen der Treffer, um ihn im Editor anzuzeigen.

A simple text search across files

Tipp

VS Code unterstützt auch die Suche mit regulären Ausdrücken im Suchfeld.

Sie können erweiterte Suchoptionen konfigurieren, indem Sie auf die Auslassungspunkte (Suchdetails umschalten) unterhalb des Suchfelds auf der rechten Seite klicken (oder ⇧⌘J (Windows, Linux Strg+Umschalt+J) drücken). Dies zeigt zusätzliche Felder zur Konfiguration der Suche.

Tipp

Sie können die Schnellsuchfunktion verwenden, um schnell Text in allen Dateien des aktuell geöffneten Ordners zu finden. Öffnen Sie die Befehlspalette (⇧⌘P (Windows, Linux Strg+Umschalt+P)) und geben Sie den Befehl **Suchen: Schnellsuchen** ein.

Erweiterte Suchoptionen

Advanced search options

In den beiden Eingabefeldern unter dem Suchfeld können Sie Muster eingeben, die in die Suche einbezogen oder ausgeschlossen werden sollen. Wenn Sie example eingeben, werden alle Ordner und Dateien mit dem Namen example im Arbeitsbereich gefunden. Wenn Sie ./example eingeben, wird der Ordner example/ auf der obersten Ebene Ihres Arbeitsbereichs gefunden. Verwenden Sie ,, um mehrere Muster zu trennen. Pfade müssen Schrägstriche verwenden. Sie können auch die Syntax für Glob-Muster verwenden, z. B.

  • * um null oder mehr Zeichen in einem Pfadsegment abzugleichen
  • ? um ein einzelnes Zeichen in einem Pfadsegment abzugleichen
  • ** um eine beliebige Anzahl von Pfadsegmenten abzugleichen, auch null
  • {} zum Gruppieren von Bedingungen (z. B. {**/*.html,**/*.txt} findet alle HTML- und Textdateien)
  • [] zum **Deklarieren** eines Zeichensatzes, der abgeglichen werden soll (example.[0-9] zum Abgleichen von example.0, example.1, …)
  • [!...] zum Negieren eines Zeichensatzes, der abgeglichen werden soll (example.[!0-9] zum Abgleichen von example.a, example.b, aber nicht example.0)

VS Code schließt standardmäßig einige Ordner aus, um die Anzahl der Suchergebnisse zu reduzieren, die Sie nicht interessieren (z. B. node_modules). Öffnen Sie die Einstellungen, um diese Regeln unter den Abschnitten files.exclude und search.exclude zu ändern.

Beachten Sie, dass Glob-Muster in der Suchansicht anders funktionieren als in Einstellungen wie files.exclude und search.exclude. In den Einstellungen müssen Sie **/example verwenden, um einen Ordner namens example in einem Unterordner folder1/example in Ihrem Arbeitsbereich zu finden. In der Suchansicht wird das Präfix ** angenommen. Die Glob-Muster in diesen Einstellungen werden immer relativ zum Pfad des Arbeitsbereichsordners ausgewertet.

Beachten Sie auch die Umschaltfläche **Ausschluss-Einstellungen und Ignorierdateien verwenden** im Feld **Ausgeschlossene Dateien**. Die Umschaltfunktion bestimmt, ob Dateien ausgeschlossen werden sollen, die von Ihren .gitignore-Dateien ignoriert und/oder von Ihren files.exclude und search.exclude-Einstellungen abgeglichen werden.

Tipp

Im Explorer können Sie mit der rechten Maustaste auf einen Ordner klicken und **In Ordner suchen** auswählen, um nur in einem Ordner zu suchen.

Durch Dateien suchen und ersetzen

Sie können auch durch Dateien suchen und ersetzen. Erweitern Sie das Suchwidget, um das Ersetzungsfeld anzuzeigen.

search and replace

Wenn Sie Text in das Ersetzungsfeld eingeben, sehen Sie eine Diff-Anzeige der ausstehenden Änderungen. Sie können dateiübergreifend aus dem Ersetzungsfeld ersetzen, alle Dateien in einer Datei ersetzen oder eine einzelne Änderung ersetzen.

search and replace diff view

Tipp

Sie können einen vorherigen Suchbegriff schnell wiederverwenden, indem Sie (Windows, Linux Unten) und (Windows, Linux Oben) verwenden, um durch Ihren Suchbegriffsverlauf zu navigieren.

Änderung der Groß-/Kleinschreibung bei Regex-Ersetzung

VS Code unterstützt die Änderung der Groß-/Kleinschreibung von Regex-Treffergruppen bei der Suche und Ersetzung im Editor oder global. Dies geschieht mit den Modifikatoren \u\U\l\L, wobei \u und \l ein einzelnes Zeichen groß/kleinschreiben und \U und \L den Rest der Treffergruppe groß/kleinschreiben. Die Modifikatoren können auch gestapelt werden – zum Beispiel, \u\u\u$1 schreibt die ersten drei Zeichen der Gruppe groß, oder \l\U$1 schreibt das erste Zeichen klein und den Rest groß. Die Erfassungsgruppe wird in der Ersetzungszeichenkette mit $n referenziert, wobei n die Reihenfolge der Erfassungsgruppe ist.

Beispiel

Changing case while doing find and replace

Die Modifikatoren können auch gestapelt werden – zum Beispiel, \u\u\u$1 schreibt die ersten drei Zeichen der Gruppe groß, oder \l\U$1 schreibt das erste Zeichen klein und den Rest groß. Die Erfassungsgruppe wird in der Ersetzungszeichenkette mit $n referenziert, wobei n die Reihenfolge der Erfassungsgruppe ist.

Such-Editor

Suchbearbeitungen ermöglichen es Ihnen, Suchergebnisse für den Arbeitsbereich in einem Vollbildeditor anzuzeigen, komplett mit Syntaxhervorhebung und optionalen Zeilen mit umgebendem Kontext.

Unten sehen Sie eine Suche nach dem Wort „SearchEditor“ mit zwei Zeilen Text vor und nach dem Treffer zur Veranschaulichung

Search Editor overview

Der Befehl **Sucheditor öffnen** öffnet einen vorhandenen Sucheditor, falls vorhanden, oder erstellt andernfalls einen neuen. Der Befehl **Neuer Sucheditor** erstellt immer einen neuen Sucheditor.

Im Sucheditor können Ergebnisse mit **Gehe zu Definition**-Aktionen navigiert werden, z. B. F12, um den Quellort in der aktuellen Editorgruppe zu öffnen, oder ⌘K F12 (Windows, Linux Strg+K F12), um den Ort in einem Editor daneben zu öffnen. Zusätzlich können Sie das Verhalten für Einzeltreffer oder Doppelklick auf ein Suchergebnis mit den Einstellungen search.searchEditor.singleClickBehaviour und search.searchEditor.doubleClickBehaviour konfigurieren. Zum Beispiel, um ein Peek-Definition-Fenster zu öffnen oder den Quellort zu öffnen.

Sie können auch die Schaltfläche **Neuen Sucheditor öffnen** oben in der Suchansicht verwenden und Ihre vorhandenen Ergebnisse aus einer Suchansicht in einen Sucheditor kopieren mit dem Link **In Editor öffnen** oben im Ergebnisbaum oder dem Befehl **Sucheditor: Ergebnisse in Editor öffnen**.

Search Editor Button

Der obige Sucheditor wurde durch Auswahl der Schaltfläche **Neuen Sucheditor öffnen** (dritte Schaltfläche) oben in der Suchansicht geöffnet.

Sucheditor-Befehle und Argumente

  • search.action.openNewEditor - Öffnet den Sucheditor in einem neuen Tab.
  • search.action.openInEditor - Kopiert die aktuellen Suchergebnisse in einen neuen Sucheditor.
  • search.action.openNewEditorToSide - Öffnet den Sucheditor in einem neuen Fenster neben dem aktuell geöffneten Fenster.

Es gibt zwei Argumente, die Sie an die Sucheditor-Befehle (search.action.openNewEditor, search.action.openNewEditorToSide) übergeben können, um Tastenkombinationen zu ermöglichen, die konfigurieren, wie ein neuer Sucheditor verhalten soll

  • triggerSearch - Ob eine Suche automatisch ausgeführt werden soll, wenn ein Sucheditor geöffnet wird. Standard ist true.
  • focusResults - Ob der Fokus auf die Ergebnisse einer Suche oder die Abfrageeingabe gesetzt werden soll. Standard ist true.

Beispielsweise führt die folgende Tastenkombination die Suche aus, wenn der Sucheditor geöffnet wird, lässt aber den Fokus im Suchabfrage-Steuerelement.

{
  "key": "ctrl+o",
  "command": "search.action.openNewEditor",
  "args": { "query": "VS Code", "triggerSearch": true, "focusResults": false }
}

Standard für Sucheditor-Kontext

Die Einstellung search.searchEditor.defaultNumberOfContextLines hat einen Standardwert von 1, was bedeutet, dass eine Kontextzeile vor und nach jeder Ergebniszeile im Sucheditor angezeigt wird.

Letzte Sucheditor-Konfiguration wiederverwenden

Die Einstellung search.searchEditor.reusePriorSearchConfiguration (Standard ist false) ermöglicht es Ihnen, die Konfiguration des zuletzt aktiven Sucheditors bei der Erstellung eines neuen Sucheditors wiederzuverwenden.

IntelliSense

Wir bieten immer Wortvervollständigung an, aber für die umfangreichen Sprachen wie JavaScript, JSON, HTML, CSS, SCSS, Less, C# und TypeScript bieten wir ein echtes IntelliSense-Erlebnis. Wenn ein Sprachdienst mögliche Vervollständigungen kennt, werden die IntelliSense-Vorschläge während der Eingabe angezeigt. Sie können sie jederzeit manuell mit Strg+Leertaste (Windows, Linux Strg+Leertaste) auslösen. Standardmäßig sind Tab oder Eingabetaste die Akzeptanztastenkürzel, aber Sie können diese Tastenkombinationen auch anpassen.

Tipp

Die Vorschlagsfilterung unterstützt CamelCase, sodass Sie die Großbuchstaben in einem Methodennamen eingeben können, um die Vorschläge einzugrenzen. Zum Beispiel bringt "cra" schnell "createApplication" hervor.

Tipp

IntelliSense-Vorschläge können über die editor.quickSuggestions und editor.suggestOnTriggerCharacters Einstellungen konfiguriert werden.

JavaScript- und TypeScript-Entwickler können die Typdeklarationsdateien (Typings) von npmjs nutzen, um IntelliSense für gängige JavaScript-Bibliotheken (Node.js, React, Angular) zu erhalten. Eine gute Erklärung zur Verwendung von Typdeklarationsdateien finden Sie im Thema JavaScript-Sprache und im Node.js-Tutorial.

Erfahren Sie mehr im Dokument IntelliSense.

Formatierung

VS Code bietet hervorragende Unterstützung für die Formatierung von Quellcode. Der Editor verfügt über zwei explizite Formatierungsaktionen

  • **Dokument formatieren** (⇧⌥F (Windows Umschalt+Alt+F, Linux Strg+Umschalt+I)) - Formatiert die gesamte aktive Datei.
  • **Auswahl formatieren** (⌘K ⌘F (Windows, Linux Strg+K Strg+F)) - Formatiert den ausgewählten Text.

Sie können diese über die **Befehlspalette** (⇧⌘P (Windows, Linux Strg+Umschalt+P)) oder das Kontextmenü des Editors aufrufen.

VS Code verfügt über Standardformatierer für JavaScript, TypeScript, JSON, HTML und CSS. Jede Sprache hat spezifische Formatierungsoptionen (z. B. html.format.indentInnerHtml), die Sie in Ihren Benutzer- oder Arbeitsbereichseinstellungen an Ihre Vorlieben anpassen können. Sie können auch den Standard-Sprachformatierer deaktivieren, wenn Sie eine andere Erweiterung installiert haben, die Formatierung für dieselbe Sprache bietet.

"html.format.enable": false

Zusätzlich zur manuellen Auslösung der Codeformatierung können Sie die Formatierung auch basierend auf Benutzergesten wie Tippen, Speichern oder Einfügen auslösen. Diese sind standardmäßig deaktiviert, aber Sie können diese Verhaltensweisen über die folgenden Einstellungen aktivieren

Hinweis

Nicht alle Formatierer unterstützen „Format on Paste“, da sie das Formatieren einer Auswahl oder eines Textbereichs unterstützen müssen, um dies zu ermöglichen.

Zusätzlich zu den Standardformatierern können Sie im Marketplace Erweiterungen für andere Sprachen oder Formatierungswerkzeuge finden. Es gibt eine Kategorie Formatters, sodass Sie leicht Formatierungs-Erweiterungen finden können. Geben Sie im Suchfeld der Ansicht **Erweiterungen** „formatters“ oder „category:formatters“ ein, um eine gefilterte Liste von Erweiterungen innerhalb von VS Code anzuzeigen.

Faltung (Code-Faltung)

Sie können Quellcodebereiche mit den Faltungssymbolen in der Rille zwischen Zeilennummern und Zeilenanfang falten. Bewegen Sie die Maus über die Rille und klicken Sie, um Regionen zu falten und zu entfalten. Verwenden Sie Umschalt+Klick auf das Faltungssymbol, um die Region und alle darin enthaltenen Regionen zu falten oder zu entfalten.

Folding

Sie können auch die folgenden Aktionen verwenden

  • Falten (⌥⌘[ (Windows, Linux Strg+Umschalt+[)) faltet die innerste, nicht eingeklappte Region am Cursor.
  • Entfalten (⌥⌘] (Windows, Linux Strg+Umschalt+])) entfaltet die eingeklappte Region am Cursor.
  • Umschalten falten (⌘K ⌘L (Windows, Linux Strg+K Strg+L)) faltet oder entfaltet die Region am Cursor.
  • Rekursiv falten (⌘K ⌘[ (Windows, Linux Strg+K Strg+[)) faltet die innerste nicht kollabierte Region am Cursor und alle Regionen innerhalb dieser Region.
  • Rekursiv entfalten (⌘K ⌘] (Windows, Linux Strg+K Strg+])) entfaltet die Region am Cursor und alle Regionen innerhalb dieser Region.
  • Alle falten (⌘K ⌘0 (Windows, Linux Strg+K Strg+0)) faltet alle Regionen im Editor.
  • Alle entfalten (⌘K ⌘J (Windows, Linux Strg+K Strg+J)) entfaltet alle Regionen im Editor.
  • Faltebene X (⌘K ⌘2 (für Ebene 2)) faltet alle Regionen der Ebene X, außer der Region an der aktuellen Cursorposition.
  • Alle Blockkommentare falten (⌘K ⌘/ (Windows, Linux Strg+K Strg+/)) faltet alle Regionen, die mit einem Blockkommentar-Token beginnen.

Faltungsregionen werden standardmäßig basierend auf der Einrückung von Zeilen ausgewertet. Eine Faltungsregion beginnt, wenn eine Zeile eine geringere Einrückung als eine oder mehrere folgende Zeilen hat, und endet, wenn eine Zeile die gleiche oder eine geringere Einrückung hat.

Faltungsregionen können auch basierend auf Syntax-Tokens der konfigurierten Sprache des Editors berechnet werden. Die folgenden Sprachen bieten bereits Syntax-basierte Faltung: Markdown, HTML, CSS, LESS, SCSS und JSON.

Wenn Sie für eine (oder alle) der oben genannten Sprachen zur einrückungsbasierten Faltung zurückkehren möchten, verwenden Sie

  "[html]": {
    "editor.foldingStrategy": "indentation"
  },

Regionen können auch durch von jeder Sprache definierte Markierungen definiert werden. Die folgenden Sprachen haben derzeit Markierungen definiert

Sprache Region starten Region beenden
Bat ::#region oder REM #region ::#endregion oder REM #endregion
C# #region #endregion
C/C++ #pragma region #pragma endregion
CSS/Less/SCSS /*#region*/ /*#endregion*/
Coffeescript #region #endregion
F# //#region oder (#_region) //#endregion oder (#_endregion)
Java //#region oder //<editor-fold> //#endregion oder //</editor-fold>
Markdown <!-- #region --> <!-- #endregion -->
Perl5 #region oder =pod #endregion oder =cut
PHP #region #endregion
PowerShell #region #endregion
Python #region oder # region #endregion oder # endregion
TypeScript/JavaScript //#region //#endregion
Visual Basic #Region #End Region

Um nur die durch Markierungen definierten Regionen zu falten und zu entfalten, verwenden Sie

  • Markierungsregionen falten (⌘K ⌘8 (Windows, Linux Strg+K Strg+8)) faltet alle Markierungsregionen.
  • Markierungsregionen entfalten (⌘K ⌘9 (Windows, Linux Strg+K Strg+9)) entfaltet alle Markierungsregionen.

Auswahl falten

Der Befehl **Manuelle Faltungsbereiche aus Auswahl erstellen** (⌘K ⌘, (Windows, Linux Strg+K Strg+,)) erstellt einen Faltungsbereich aus den aktuell ausgewählten Zeilen und komprimiert ihn. Dieser Bereich wird als **manueller** Faltungsbereich bezeichnet, der über den von den Faltungsanbietern berechneten Bereichen liegt.

Manuelle Faltungsbereiche können mit dem Befehl Manuelle Faltungsbereiche entfernen (⌘K ⌘. (Windows, Linux Ctrl+K Ctrl+.)) entfernt werden.

Manuelle Faltungsbereiche sind besonders nützlich für Fälle, in denen es keine Unterstützung für das Falten durch die Programmiersprache gibt.

Einrückung

VS Code ermöglicht Ihnen die Steuerung der Texteinrückung und ob Sie Leerzeichen oder Tabulatoren verwenden möchten. Standardmäßig fügt VS Code Leerzeichen ein und verwendet 4 Leerzeichen pro Tab-Taste. Wenn Sie eine andere Standardeinstellung verwenden möchten, können Sie die Einstellungen editor.insertSpaces und editor.tabSize Einstellungen ändern.

    "editor.insertSpaces": true,
    "editor.tabSize": 4,

Automatische Erkennung

VS Code analysiert Ihre geöffnete Datei und bestimmt die Einrückung, die im Dokument verwendet wird. Die automatisch erkannte Einrückung überschreibt Ihre Standard-Einrückungseinstellungen. Die erkannte Einstellung wird auf der rechten Seite der Statusleiste angezeigt.

auto detect indentation

Sie können auf die Einrückungsanzeige in der Statusleiste klicken, um ein Dropdown-Menü mit Einrückungsbefehlen zu öffnen, mit denen Sie die Standardeinstellungen für die geöffnete Datei ändern oder zwischen Tabulatoren und Leerzeichen konvertieren können.

indentation commands

Hinweis

Die automatische Erkennung von VS Code prüft Einrückungen von 2, 4, 6 oder 8 Leerzeichen. Wenn Ihre Datei eine andere Anzahl von Leerzeichen verwendet, wird die Einrückung möglicherweise nicht korrekt erkannt. Wenn Sie beispielsweise mit 3 Leerzeichen einrücken, möchten Sie möglicherweise editor.detectIndentation deaktivieren und die Tabulatorgröße explizit auf 3 festlegen.

    "editor.detectIndentation": false,
    "editor.tabSize": 3,

Unterstützung für Dateikodierung

Stellen Sie die Dateikodierung global oder pro Arbeitsbereich ein, indem Sie die Einstellung files.encoding in den Benutzereinstellungen oder Arbeitsbereichseinstellungen verwenden.

files.encoding setting

Sie können die Dateikodierung in der Statusleiste anzeigen.

Encoding in status bar

Klicken Sie auf die Kodierungsschaltfläche in der Statusleiste, um die aktive Datei mit einer anderen Kodierung erneut zu öffnen oder zu speichern.

Reopen or save with a different encoding

Wählen Sie dann eine Kodierung aus.

Select an encoding

Überschreibmodus

Vor Version 1.96 unterstützte VS Code nur den Einfügemodus, bei dem Zeichen an der Cursorposition eingefügt werden, es sei denn, Sie installierten die Vim Tastenzuordnungserweiterung.

Ab Version 1.96 unterstützt VS Code den Überschreibmodus, mit dem Sie vorhandene Zeichen überschreiben können, anstatt Zeichen an der Cursorposition einzufügen. Standardmäßig ist der Überschreibmodus deaktiviert.

Um zwischen dem Einfüge- und dem Überschreibmodus zu wechseln, führen Sie den Befehl Überschreib-/Einfügemodus umschalten im Befehls-Paletten aus oder drücken Sie (⌥⌘O (Windows, Linux Einfg)). Wenn Sie sich im Überschreibmodus befinden, zeigt eine Anzeige in der Statusleiste OVR an.

Sie können den Cursorstil für den Überschreibmodus ändern, indem Sie die Einstellung editor.overtypeCursorStyle konfigurieren.

Verwenden Sie die Einstellung editor.overtypeOnPaste, um Text beim Einfügen zu überschreiben. Sie müssen sich im Überschreibmodus befinden, damit diese Einstellung wirksam wird.

Dateien vergleichen

VS Code unterstützt verschiedene Möglichkeiten, den Inhalt der aktuellen Datei oder zweier beliebiger Dateien zu vergleichen.

Wenn eine aktive Datei im Editor geöffnet ist, haben Sie die folgenden Vergleichsoptionen:

  • Mit einer Arbeitsbereichsdatei vergleichen: Wählen Sie im Befehls-Paletten Datei: Aktive Datei vergleichen mit... und wählen Sie dann eine andere Datei zum Vergleichen aus.
  • Mit der Zwischenablage vergleichen: Wählen Sie im Befehls-Paletten Datei: Aktive Datei mit Zwischenablage vergleichen (⌘K C (Windows, Linux Strg+K C)), um die aktuelle Datei mit dem Inhalt der Zwischenablage zu vergleichen.
  • Mit gespeicherter Version vergleichen: Wählen Sie im Befehls-Paletten Datei: Aktive Datei mit gespeicherter Version vergleichen (⌘K D (Windows, Linux Strg+K D)), um die aktuelle Datei mit der zuletzt gespeicherten Version zu vergleichen.

Um zwei beliebige Dateien zu vergleichen

  • Klicken Sie mit der rechten Maustaste auf eine Datei in der Explorer-Ansicht und wählen Sie Zum Vergleichen auswählen. Klicken Sie dann mit der rechten Maustaste auf eine zweite Datei und wählen Sie Mit ausgewählter vergleichen.
  • Um einen Vergleich zwischen zwei leeren Editorfenstern zu starten, wählen Sie im Befehls-Paletten Datei: Neue unbenannte Textdateien vergleichen.
Tipp

Sie können VS Code von der Befehlszeile mit der Option --diff starten, um zwei Dateien zu vergleichen. Erfahren Sie mehr über die VS Code-Befehlszeilenschnittstelle.

Nächste Schritte

Sie haben die Benutzeroberfläche kennengelernt – es gibt noch viel mehr in VS Code zu entdecken. Lesen Sie weiter, um mehr über Folgendes zu erfahren:

Häufig gestellte Fragen

Ist es möglich, global zu suchen und zu ersetzen?

Ja, erweitern Sie das Suchfeld, um ein Ersetzungsfeld einzufügen. Sie können über alle Dateien in Ihrem Arbeitsbereich suchen und ersetzen. Beachten Sie, dass die Suche nur in den aktuell geöffneten Dateien ausgeführt wird, wenn Sie VS Code nicht in einem Ordner geöffnet haben.

global search and replace

Wie aktiviere ich den Zeilenumbruch?

Sie können den Zeilenumbruch über die Einstellung editor.wordWrap Einstellung steuern. Standardmäßig ist editor.wordWrap auf off eingestellt, aber wenn Sie es auf on setzen, wird der Text auf die Breite des Editorfensters umgebrochen.

    "editor.wordWrap": "on"

Sie können den Zeilenumbruch für die VS Code-Sitzung mit ⌥Z (Windows, Linux Alt+Z) umschalten.

Sie können auch vertikale Spaltenlineale zum Editor hinzufügen, indem Sie die Einstellung editor.rulers verwenden, die ein Array von Spaltenzeichenpositionen entgegennimmt, an denen Sie vertikale Lineale wünschen.

Wie in anderen Editoren gelten Befehle wie Ausschneiden und Kopieren für die gesamte umgebrochene Zeile. Dreifachklick wählt die gesamte umgebrochene Zeile aus. Das zweimalige Drücken von Pos1 verschiebt den Cursor an den Anfang der Zeile. Das zweimalige Drücken von Ende verschiebt den Cursor ans Ende der Zeile.

Wie kann ich vermeiden, zusätzliche Cursor in umgebrochenen Zeilen zu platzieren?

Wenn Sie Zeilenumbrüche beim Hinzufügen von Cursorn über oder unter der aktuellen Auswahl ignorieren möchten, können Sie { "logicalLine": true } an args in der Tastenkombination übergeben, wie hier:

{
  "key": "shift+alt+down",
  "command": "editor.action.insertCursorBelow",
  "when": "textInputFocus",
  "args": { "logicalLine": true },
},
{
  "key": "shift+alt+up",
  "command": "editor.action.insertCursorAbove",
  "when": "textInputFocus",
  "args": { "logicalLine": true },
},
© . This site is unofficial and not affiliated with Microsoft.