Technologische Neuigkeiten, Bewertungen und Tipps!

So formatieren Sie Code in VS Code automatisch

Wenn Sie vorhaben, Code zu lernen oder bereits täglich Code schreiben, ist ein zuverlässiger Code-Editor wie Visual Studio Code ein Muss. Beim Schreiben von Code müssen Sie an die Formatierung denken, da diese das Lesen für Menschen erleichtert.

Alle diese spezifischen Regeln zu Einzügen und Zeilenabständen sind wichtig, werden aber auch leicht vergessen, wenn Sie sich auf Ihre Arbeit konzentrieren.

Aus diesem Grund können Sie in VS Code Autoformatierungserweiterungen verwenden, die Ihnen dabei helfen können. Einige Autoformatierungserweiterungen können mehr als eine Programmiersprache formatieren, während Sie für andere spezielle Erweiterungen integrieren müssen.

So formatieren Sie HTML automatisch

Hypertext Markup Language oder HTML ist eine Programmiersprache, die zum Erstellen und Anzeigen von Webseiten verwendet wird. Webentwickler und Softwareentwickler verwenden HTML täglich und können von einem Autoformatierungstool profitieren.

Wenn Sie sich für den Code-Editor VS Code entscheiden, können Sie hier Prettier, einen beliebten Code-Formatierer, finden und die Autoformatierungsfunktion aktivieren.

  1. Öffnen Sie Visual Studio Code auf Ihrem Computer.
  2. Navigieren Sie zur Registerkarte „Erweiterung“ auf der linken Seite des Bildschirms. Sie wird als vier Blöcke dargestellt.
  3. Geben Sie in das Suchleistenfeld „Prettier Code Formatter“ ein.
  4. Sie erhalten mehrere Suchergebnisse, wählen Sie jedoch das Ergebnis aus, das von Prettier und nicht von einer anderen Person oder Firma stammt.
  5. Klicken Sie auf die Schaltfläche „Installieren“ und die Erweiterung wird innerhalb von Sekunden heruntergeladen.

Nachdem Sie den Prettier-Formatierer installiert haben, können Sie die Autoformatierungsfunktion aktivieren und beim Schreiben von Code eine einheitliche Formatierung sicherstellen.

  1. Öffnen oder erstellen Sie eine neue HTML-Datei in VS Code.
  2. Gehen Sie zu „Einstellungen“ in der unteren linken Ecke des Bildschirms.
  3. Geben Sie „Format“ in das Suchfeld ein und wechseln Sie zur Registerkarte „Benutzer“.
  4. Klicken Sie auf die Option „Standardformatierer“ und wählen Sie „Prettier“ aus der Liste.
  5. Scrollen Sie ein wenig nach unten, bis Sie die Option „Editor: Beim Speichern formatieren“ sehen.
  6. Aktivieren Sie das Kontrollkästchen neben dieser Option.
  7. Gehen Sie zurück zu Ihrer Datei und prüfen Sie, ob die Einstellung funktioniert.

Prettier sollte Ihre HTML-Dateien beim Speichern automatisch formatieren.

JSON automatisch formatieren

Die JavaScript Object Notation oder JSON gilt als sprachunabhängiges Datenaustauschformat. Mobile Apps und Computerprogramme verwenden JSON-Dateien, um Daten von den Servern zu lesen und auf dem Bildschirm anzuzeigen.

Wenn Sie eine JSON-Datei im Visual Studio Code-Editor erstellen, müssen Sie auch auf die Formatierung achten. Die gute Nachricht ist, dass Sie die Prettier-Formatierungserweiterungen im VS Code verwenden können, um einen einheitlichen Stil für Ihre JSON-Dateien durchzusetzen.

Hier finden Sie alles, was Sie tun müssen, um die automatische Formatierungsfunktion für JSON-Dateien zu aktivieren.

  1. Starten Sie VS Code und gehen Sie zur entsprechenden Registerkarte „Erweiterungen“ auf der linken Seite des Fensters.
  2. Suchen Sie im Suchfeld nach „Prettier Code Formatter“.
  3. Normalerweise ist das erste Ergebnis das, auf das Sie klicken möchten. Um sicherzugehen, wählen Sie jedoch das Ergebnis aus, bei dem „Prettier“ als Entwickler aufgeführt ist.
  4. Klicken Sie auf „Installieren“ und warten Sie einige Sekunden, bis das Formatierungsprogramm heruntergeladen ist.

Wenn das Prettier-Formatierungsprogramm installiert ist, stellen Sie mit den folgenden Schritten sicher, dass die Autoformatierungsfunktion aktiviert ist.

  1. Erstellen Sie eine neue JSON-Datei oder öffnen Sie eine, die noch nicht formatiert wurde.
  2. Klicken Sie unten links auf „Einstellungen“.
  3. Suchen Sie nach „Format“.
  4. Klicken Sie auf den Abschnitt „Standardformatierer“. Wählen Sie aus der Dropdown-Liste „Schöner“ aus.
  5. Scrollen Sie nach unten und halten Sie an, wenn Sie die Option „Editor: Beim Speichern formatieren“ sehen.
  6. Klicken Sie auf das Kontrollkästchen neben dieser Option.
  7. Überprüfen Sie, ob die Autoformatierungsfunktion funktioniert.

Das ist alles. Die Prettier-Erweiterung im VS Code-Editor macht die automatische Formatierung mühelos.

Auto Format Python

Heutzutage ist Python eine der beliebtesten Programmiersprachen und wird häufig von Webentwicklern und Programmierbegeisterten verwendet. Es wird zum Entwerfen und Erstellen von Software und Websites, zum Analysieren von Daten, zum Automatisieren von Aufgaben und für vieles mehr verwendet.

Wenn Sie VS Code zum Bearbeiten der Python-Datei verwenden, müssen Sie den richtigen Formatierer verwenden. Prettier funktioniert zwar mit vielen verschiedenen Programmiersprachen, ist jedoch nicht mit Python kompatibel.

Glücklicherweise bietet VS Code eine Lösung. Einer der besten Python-Formatierer in VS Code ist Black und kann zum Formatieren von Code verwendet werden, wenn Sie eine Datei automatisch speichern. Bevor Sie Black verwenden können, müssen Sie jedoch die Python-Erweiterung von Microsoft für VS Code herunterladen:

  1. Öffnen Sie VS Code und suchen Sie im Suchfeld nach „Python“.
  2. Stellen Sie sicher, dass es sich um die Erweiterung von Microsoft handelt, und klicken Sie auf „Installieren“.
  3. Um den Phyton-Formatierer zu installieren, geben Sie den folgenden Text in Ihre virtuelle Umgebung ein: „$ pip install black“.
  4. Gehen Sie in VS Code zu „Einstellungen“ und suchen Sie nach „Phyton-Formatierungsanbieter“.
  5. Wählen Sie im Dropdown-Menü „Schwarz“ aus.
  6. Scrollen Sie nach unten und suchen Sie die Option „Editor: Beim Speichern formatieren“.
  7. Aktivieren Sie das Kontrollkästchen neben dieser Option.

Schwarz, der Python-Formatierer formatiert den Code jetzt automatisch jedes Mal, wenn Sie die Datei speichern.

VS Code: Automatische Formatierung beim Speichern

Sie können die automatische Formatierungsfunktion unabhängig davon aktivieren, welche Programmiersprache oder welchen Codeformatierer Sie in VS Code verwenden.

Die meisten Entwickler verwenden mehrere Codeformatierungserweiterungen in VS Code. Sie können daher sicherstellen, dass jede davon die Datei beim Speichern automatisch formatiert.

So funktioniert es:

  1. Öffnen Sie den Visual Studio Code-Editor.
  2. Klicken Sie unten links auf das Zahnradsymbol „Einstellungen“.
  3. Suchen Sie nach „Formatter“ und klicken Sie auf die Option „Editor: Standardformatter“.
  4. Wählen Sie aus dem Dropdown-Menü den Codeformatierer aus, den Sie verwenden möchten.
  5. Scrollen Sie etwas nach unten und aktivieren Sie das Kontrollkästchen neben der Option „Editor: Beim Speichern formatieren“.

Sie können den Vorgang für jeden Codeformatierer wiederholen, den Sie in VS Code verwenden.

FAQs

Warum funktioniert die automatische „Formatierung beim Speichern“ nicht?

Wenn in einem VS Code-Formatierer die Option „Beim Speichern formatieren“ vorhanden ist und diese nicht richtig funktioniert, handelt es sich wahrscheinlich um eine Störung.

Möglicherweise treten bei Ihrer Formatierungsversion Probleme auf und Sie müssen prüfen, ob ein Update verfügbar ist. Das Problem liegt jedoch möglicherweise nicht bei Ihnen und der Fehler wird von den VS Code-Entwicklern behoben.

Wie deaktiviere ich die automatische Formatierung in VS Code?

Das Deaktivieren der automatischen Formatierungsfunktion ist ein Kinderspiel. Befolgen Sie diese Schritte, um die automatische Formatierung zu deaktivieren.

1. Öffnen Sie den VS Code-Editor und klicken Sie auf das Symbol „Einstellungen“.

2. Suchen Sie nach „Formatierer“ und wählen Sie den Formatierer aus, für den Sie die automatische Formatierung deaktivieren möchten.

3. Suchen Sie die Option „Editor: Beim Speichern formatieren“ und deaktivieren Sie das Kontrollkästchen daneben.

Mühelose automatische Codeformatierung in Visual Studio Code

Einer der besten Aspekte bei der Verwendung von VS Code ist seine gut gestaltete Benutzeroberfläche, die es selbst Anfängern ermöglicht, sich im Editor zurechtzufinden.

Eine korrekte und durchgängige Codeformatierung ist für lesbaren Code unerlässlich, diese Konventionen können jedoch mühsam sein, wenn Sie sie manuell vornehmen müssen.

Aber die gute Nachricht ist, dass der VS Code-Editor über zahlreiche Code-Formatierer verfügt, die das Schreiben von lesbarem Code einfacher und schneller machen können.

Unabhängig davon, ob es sich um Prettier, Black oder eine andere Erweiterung handelt, haben Benutzer immer die Möglichkeit, den Code automatisch zu formatieren, sobald sie die Datei speichern.

Welche Programmiersprache verwenden Sie und welcher Formatierer funktioniert am besten? Lassen Sie es uns im Kommentarbereich unten wissen.

Your Header Sidebar area is currently empty. Hurry up and add some widgets.