it-swarm.com.de

Zeigen Sie Leerzeichen in Visual Studio-Code an

Ist es möglich, Leerzeichen wie das Leerzeichen in Visual Studio Code anzuzeigen?

Es scheint keine Option dafür im settings.json zu geben (obwohl es eine Option in Atom.io ist), und ich war nicht in der Lage, Whitespace-Zeichen mit CSS anzuzeigen .

330
eirvandelden

VS Code 1.6.0 und höher

Wie von aloisdg below erwähnt, ist editor.renderWhitespace jetzt eine Aufzählung, die entweder none, boundary oder all enthält. So zeigen Sie alle Leerzeichen an:

"editor.renderWhitespace": "all", 

Vor VS Code 1.6.0

Vor 1.6.0 mussten Sie editor.renderWhitespace auf true setzen:

"editor.renderWhitespace": true
508
revo

Dies kann auch über das Hauptmenü View -> Render Whitespace erfolgen.

92
Coder Absolute

UPDATE (Juni 2019)

Für diejenigen, dieLeerzeichenmit einer Tastenkombination umschalten möchten, können Sie einfach eine Tastenkombination hinzufügen.

In den neuesten Versionen von Visual Studio Code gibt es jetzt eine benutzerfreundliche grafische Oberfläche (d. H. Es müssen keine JSON-Daten usw. eingegeben werden) zum Anzeigen und Bearbeiten aller verfügbaren Tastaturkürzel. Es ist immer noch unter

Datei> Einstellungen> Tastaturkürzel (oder verwenden Sie Ctrl+KCtrl+S)

Es gibt auch ein Suchfeld, mit dem Sie die gewünschten Tastenkombinationen schnell finden (und filtern) können. Das Hinzufügen neuer und das Bearbeiten der vorhandenen Tastenkombinationen ist jetzt viel einfacher:

enter image description here


Das Umschalten von Whitespace-Zeichen hat keine Standard-Tastenkombination, Sie können also gerne eine hinzufügen. Drücken Sie einfach die + Zeichen auf der linken Seite der entsprechenden Zeile (oder drücken Sie Enteroder doppelklicken Sie auf eine beliebige Stelle in dieser Zeile und geben Sie die gewünschte Kombination in das Popup-Fenster ein.

Und wenn die von Ihnen gewählte Tastenkombination bereits für eine andere Aktion verwendet wird, wird eine praktische Warnung angezeigt, auf die Sie klicken und beobachten können, welche Aktion (en) die von Ihnen gewählte Tastenkombination bereits verwendet:

enter image description here

Wie Sie sehen, ist alles sehr intuitiv und bequem.
Gute Arbeit, Microsoft!


Ursprüngliche (alte) Antwort

Für diejenigen, dieLeerzeichen mithilfe der Tastenkombinationumschalten möchten, können Sie der Datei keybindings.json eine benutzerdefinierte Bindung hinzufügen (File> Preferences> Keyboard Shortcuts).

Beispiel:

// Place your key bindings in this file to overwrite the defaults
[
    {
        "key": "ctrl+shift+i",
        "command": "editor.action.toggleRenderWhitespace"
    }
]

Hier habe ich eine Kombination von zugewiesen Ctrl+Shift+i Um unsichtbare Zeichen umzuschalten, können Sie natürlich eine andere Kombination wählen.

53
informatik01

Leerzeichen in Visual Studio-Code anzeigen

ändern Sie die setting.json, indem Sie die folgenden Codes hinzufügen!

// Place your settings in this file to overwrite default and user settings.
{
    "editor.renderWhitespace": "all"
}

einfach so!
(PS: Es gibt keine "wahre" Option! Auch das funktioniert.) enter image description here

47
xgqfrms

Um die Änderungen zu demonstrieren, die editor.renderWhitespace : true an Ihrem VSCode vornimmt, habe ich diesen Screenshot hinzugefügt:
enter image description here .

Wo Tab sind und Spacesind .

25
Zack S

Es ist kein boolean mehr. Sie wechselten zu einem enum. Jetzt können wir wählen zwischen: none, boundary und all.

// Controls how the editor should render whitespace characters,
// posibilties are 'none', 'boundary', and 'all'.
// The 'boundary' option does not render single spaces between words.
"editor.renderWhitespace": "none",

Sie können den Originalunterschied auf GitHub sehen.

15
aloisdg

Drücke die F1-Taste und tippe dann "Toggle Render Whitespace" oder die Teile davon, an die du dich erinnern kannst :)

Ich verwende vscode Version 1.22.2, daher könnte dies eine Funktion sein, die es 2015 noch nicht gab.

5
Stevelot

Damit das Diff Whitespace ähnlich wie git diff anzeigt, setzen Sie diffEditor.ignoreTrimWhitespace auf false. edit.renderWhitespace ist nur am Rande hilfreich.

// Controls if the diff editor shows changes in leading or trailing whitespace as diffs
"diffEditor.ignoreTrimWhitespace": false,

Um die Einstellungen zu aktualisieren, gehen Sie zu

Datei> Einstellungen> Benutzereinstellungen

Hinweis für Mac-Benutzer: Das Menü "Einstellungen" befindet sich unter "Code nicht Datei". Beispiel: "Code"> "Einstellungen"> "Benutzereinstellungen".

Dies öffnet eine Datei mit dem Titel "Standardeinstellungen". Erweitern Sie den Bereich //Editor. Jetzt können Sie sehen, wo sich all diese mysteriösen editor.* -Einstellungen befinden. Suchen Sie (STRG + F) nach renderWhitespace. Auf meiner Box habe ich:

// Controls how the editor should render whitespace characters, posibilties are 'none', 'boundary', and 'all'. The 'boundary' option does not render single spaces between words.
"editor.renderWhitespace": "none",

Um die Verwirrung zu vergrößern, kann das links Fenster "Standardeinstellungen" nicht bearbeitet werden. Sie müssen sie mit dem rechts Fenster "settings.json" überschreiben. Sie können die Einfügeeinstellungen von "Standardeinstellungen" nach "settings.json" kopieren:

// Place your settings in this file to overwrite default and user settings.
{
     "editor.renderWhitespace": "all",
     "diffEditor.ignoreTrimWhitespace": false
}

Am Ende habe ich renderWhitespace ausgeschaltet.

5
P.Brian.Mackey

Die Option, Leerzeichen sichtbar zu machen, wird jetzt als Option im Menü "Ansicht" unter "Render-Leerzeichen umschalten" in Version 1.15.1 von Visual Studio Code angezeigt.

5
Dragonthoughts
  1. Öffnen Sie die Benutzervorgaben. Tastaturkürzel: CTR + SHIFT + P -> Einstellungen: Benutzereinstellungen öffnen;

  2. In Suchfeld einfügen Whitespace, und all Parameter auswählen enter image description here

2
Andrey Patseiko

Update für v1.37: Hinzufügen der Option zum Rendern von Leerzeichen nur innerhalb des ausgewählten Texts. Siehe Versionshinweise zu Version 1.37, Whitespace rendern .

Die Einstellung editor.renderWhitespace unterstützt jetzt die Option selection. Wenn diese Option aktiviert ist, wird das Leerzeichen nur für den ausgewählten Text angezeigt:

"editor.renderWhitespace": "selection"

und

"workbench.colorCustomizations": {    
  "editorWhitespace.foreground": "#fbff00"
}

demo of whitespace render in selection

2
Mark