it-swarm.com.de

Wie kann ich den Umrechnungsfaktor zwischen Tabulator und Leerzeichen anpassen, wenn ich Visual Studio Code verwende?

Wie kann ich den Umrechnungsfaktor zwischen Tabulator und Leerzeichen anpassen, wenn ich Visual Studio Code verwende?

Zum Beispiel scheint es im Moment in HTML zwei Leerzeichen pro Druck von zu erzeugen TAB, aber in TypeScript erzeugt es 4.

645
J. Abrahamson

Standardmäßig versucht Visual Studio Code, die Einrückungsoptionen abhängig von der geöffneten Datei zu erraten.

Sie können das Erraten der Einrückung über "editor.detectIndentation": false deaktivieren.

Sie können dies einfach über diese drei Einstellungen für Windows im Menü DateiVoreinstellungenBenutzereinstellungen und für Mac im Menü Code → anpassen VoreinstellungenEinstellungen oder ⌘,:

// The number of spaces a tab is equal to. This setting is overridden
// based on the file contents when `editor.detectIndentation` is true.
"editor.tabSize": 4,

// Insert spaces when pressing Tab. This setting is overriden
// based on the file contents when `editor.detectIndentation` is true.
"editor.insertSpaces": true,

// When opening a file, `editor.tabSize` and `editor.insertSpaces`
// will be detected based on the file contents. Set to false to keep
// the values you've explicitly set, above.
"editor.detectIndentation": false
888
Alex Dima

Ich verwende Version 1.21, aber ich denke, dass dies auch für frühere Versionen gelten kann.

Schauen Sie sich die rechte untere Seite des Bildschirms an. Sie sollten etwas sehen, das Spaces oder Tab-Size sagt.

Mein zeigt Räume, ->  enter image description here

  1. Klicken Sie auf die Spaces (oder Tab-Size)
  2. Wählen Sie Indent Using Spaces oder Indent using Tabs
  3. Wählen Sie die gewünschte Anzahl von Leerzeichen oder Registerkarten aus.

Dies funktioniert nur pro Dokument, nicht projektweit. Wenn Sie es projektweit anwenden möchten, müssen Sie den Benutzereinstellungen auch "editor.detectIndentation": false hinzufügen.

510
Tricky

In der neuen Version von Visual Studio Code können Sie einen anderen Dateityp für die tabSize-Größe angeben. Hier ist das Beispiel meines settings.json mit Standard 4 Leerzeichen und JavaScript/JSON 2 Leerzeichen:

{
  // I want my default to be 4, but JS/JSON to be 2
  "editor.tabSize": 4,
  "[javascript]": {
    "editor.tabSize": 2
  },
  "[json]": {
    "editor.tabSize": 2
  }
}

PS: Nun, wenn Sie nicht wissen, wie Sie diese Datei öffnen, können Sie: Linksunteres Zahnrad -> Einstellungen wählen

114
Xin Wang

Standardmäßig erkennt Visual Studio Code automatisch den Einzug der aktuell geöffneten Datei. Wenn Sie diese Funktion ausschalten und alle Einrückungen vornehmen möchten, z. B. zwei Leerzeichen, führen Sie in den Benutzereinstellungen oder Arbeitsbereichseinstellungen folgende Schritte aus.

{
    "editor.tabSize": 2,

    "editor.detectIndentation": false
}
102
Jim Doyle

Wir können Größe der Registerkarte nach Dateityp steuern mit EditorConfig und Visual Studio-Code-Erweiterung . Wir können dann machen Alt + Shift + F spezifisch für jeden Dateityp.

Installation

ext install EditorConfig

Beispielkonfiguration

.editorconfig

[*]
indent_style = space

[*.{cs,js}]
indent_size = 4

[*.json]
indent_size = 2

settings.json

EditorConfig überschreibt alle settings.json-Konfigurationen für den Editor. editor.detectIndentation muss nicht geändert werden.

49
Shaun Luttin

Das ist lonefy.vscode-js-css-html-formatter schuld. Deaktivieren Sie es und installieren Sie HookyQR.beautify.

Beim Speichern werden Ihre Registerkarten jetzt nicht konvertiert.

6
user3550138

Sie möchten sicherstellen, dass Ihre editorconfig nicht in Konflikt mit der Konfiguration der Benutzer- oder Arbeitsbereichseinstellungen steht, da ich nur ein wenig Ärger hatte, wenn ich davon ausgehe, dass die Einstellungen der Einstellungsdateien nicht angewendet wurden, als meine Editorkonfiguration diese Änderungen rückgängig machte.

6
Travis Brown

In Ihrer rechten unteren Ecke haben Sie Leerzeichen: Leerzeichen: 2

Dort können Sie den Einzug nach Ihren Wünschen ändern: Einzugsoptionen

3
Dacomis

Wenn die akzeptierte Antwort in diesem Beitrag nicht funktioniert, probieren Sie es aus:

Ich hatte EditorConfig für Visual Studio Code in meinem Editor installiert und überschrieb dabei immer wieder meine Benutzereinstellungen, bei denen Dateien mit Leerzeichen eingerückt wurden. Bei jedem Wechsel zwischen den Editor-Registerkarten wurde meine Datei automatisch mit Registerkarten eingerückt, auch wenn ich die Einrückung in Leerzeichen umgewandelt hatte !!!

Nach der Deinstallation dieser Erweiterung ändert sich die Einrückung nicht mehr zwischen dem Wechseln der Editor-Registerkarten, und ich kann komfortabler arbeiten, anstatt Tabulatoren bei jedem Dateiwechsel manuell in Leerzeichen umwandeln zu müssen - das ist schmerzhaft.

2
dhruvpatel

Menü Datei Einstellungen Einstellungen

Zu Benutzereinstellungen hinzufügen:

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

klicken Sie dann mit der rechten Maustaste auf Ihr Dokument, falls Sie bereits eines geöffnet haben, und klicken Sie auf Dokument formatieren, damit Ihr vorhandenes Dokument diesen neuen Einstellungen folgt.

1
Gmoney Mozart

In VSC Version 1.31.1 oder mehr (denke ich) . Wie sed Alex Dima . Sie können dies leicht über diese Einstellungen anpassen 

  • Windows im Menü Datei → Voreinstellungen → Benutzereinstellungen oder kurze Tasten ctr + shift + p
  • Mac im Menü Code → Einstellungen → Einstellungen oder ⌘,

 enter image description here

 enter image description here

1
Andrey Patseiko

Bei Verwendung von TypeScript beträgt die Standardbreite der Registerkarten immer zwei, unabhängig davon, was in der Symbolleiste angegeben ist. Sie müssen "prettier.tabWidth" in Ihren Benutzereinstellungen einstellen, um es zu ändern.

Ctrl + P, Typ → Benutzereinstellungen, fügen Sie hinzu:

"prettier.tabWidth": 4
1
Steve Hanov

Die Lösung von @ alex-dima aus dem Jahr 2015 ändert die Tabulatorgrößen und -räume für alle Dateien. Die Lösung von @ Tricky aus dem Jahr 2016 scheint nur die Einstellungen für die aktuelle Datei zu ändern.

Ab 2017 habe ich eine andere Lösung gefunden, die pro Sprache funktioniert. In Visual Studio Code wurden für Elixir nicht die richtigen Registerkartengrößen und Speicherplatzeinstellungen verwendet. Daher stellte ich fest, dass ich die Einstellungen für alle Elixir-Dateien ändern konnte. 

Ich habe in der Statusleiste auf die Sprache geklickt (in meinem Fall "Elixir"), "Sprachbasierte Einstellungen für 'Elixir' konfigurieren ..." gewählt und die Elixir-spezifischen Spracheinstellungen bearbeitet. Ich habe gerade die Einstellungen "editor.tabSize" und "editor.insertSpaces" von den Standardeinstellungen auf der linken Seite kopiert (ich bin froh, dass diese angezeigt werden) und sie auf der rechten Seite geändert.

Es hat großartig funktioniert, und jetzt verwenden alle Elixir-Sprachdateien die richtige Größe für die Tabulatorgröße und den Platz.

1
Kevin Peter

Wenn Sie die schönere Erweiterung in vscode verwenden, fügen Sie Folgendes der Datei settings.json hinzu:

"editor.insertSpaces": false,
"editor.tabSize": 4, 
"editor.detectIndentation": false,

"prettier.tabWidth": 4,
"prettier.useTabs": true  // this made it finally work for me 
1
slowpoke123

Ich habe versucht, editor.tabSize in 4 zu ändern, aber .editorConfig überschreibt alle Einstellungen, die ich festgelegt hatte. In den Benutzereinstellungen müssen also keine Einstellungen geändert werden. Sie müssen nur die .editorConfig-Datei bearbeiten:

set indent_size = 4
0
Gh111

Sie können einfach auf die Tastatur klicken oder die Strg-Taste drücken, um die Einstellungsseite zu öffnen. Scrollen Sie dann nach unten. Die Größe der Registerkarte sollte angezeigt werden.

0
Samuel Chen

Wenn dies für Angular 2 gilt und die CLI Dateien generiert, die anders formatiert sein sollen, können Sie diese Dateien bearbeiten, um das Generierte zu ändern:

npm_modules/@angular/cli/blueprints/component/files/__path__/*

Nicht unbedingt empfohlen, da ein npm-Update Ihre Arbeit löscht, aber es hat mir viel Zeit gespart.

0
Ben Taliadoros

Benutzer3550138 ist korrekt. lonefy.vscode-js-css-html-formatter überschreibt alle Einstellungen, die in anderen Antworten erwähnt werden. Sie müssen es jedoch nicht deaktivieren oder deinstallieren, da es konfiguriert werden kann.

Vollständige Anweisungen finden Sie, indem Sie die Erweiterungs-Seitenleiste öffnen und auf diese Erweiterung klicken. Die Konfigurationsanweisungen werden im Editor-Arbeitsbereich angezeigt. Zumindest für mich in Visual Studio Code Version 1.14.1.

0
DRL