web-dev-qa-db-fra.com

Afficher les caractères d'espacement dans le code Visual Studio

Est-il possible d'afficher des caractères d'espacement, comme le caractère d'espace, dans Visual Studio Code?

Il ne semble pas y avoir d’option pour cela dans le settings.json (bien que ce soit une option dans Atom.io), et je n’ai pas été capable d’afficher des caractères d’espace en utilisant CSS.

visual-studio-codewhitespacevscode-settings
308
eirvandelden

Code VS 1.6.0 et supérieur

Comme mentionné par voir ci-dessous , editor.renderWhitespace est maintenant une énumération prenant nonename__, boundaryou allname__. Pour afficher tous les espaces:

"editor.renderWhitespace": "all",

Avant le code VS 1.6.0

Avant la version 1.6.0, vous deviez définir editor.renderWhitespace sur truename__:

"editor.renderWhitespace": true
478
revo

Cela peut également être fait via le menu principal View -> Toggle Render Whitespace. Entre, j'utilise le code Visual Studio v 1.8.x

75
Coder Absolute

Pour ceux qui souhaitent basculer les caractères d'espacement à l'aide d'un raccourci clavier, vous pouvez ajouter une liaison personnalisée au fichier keybindings.json ( Fichier> Préférences> Raccourcis clavier ).

Exemple :

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

Ici, j'ai assigné une combinaison de Ctrl+Shift+i Pour basculer entre les caractères invisibles, vous pouvez bien sûr choisir une autre combinaison.

49
informatik01

Afficher les caractères d'espacement dans le code Visual Studio

changez le setting.json en ajoutant les codes suivants!

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

comme ça!
(PS: il n'y a pas d'option "true" !, même si cela fonctionne aussi.) enter image description here

46
xgqfrms

Juste pour montrer les changements que editor.renderWhitespace : true apportera à votre VSCode, j'ai ajouté cette capture d'écran:
enter image description here .

Où Tab sont → et Spacesont .

24
Zack S

Ce n'est plus un boolean. Ils sont passés à enum. Nous pouvons maintenant choisir entre: none, boundary et 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",

Vous pouvez voir le diff original sur GitHub .

15
aloisdg

Appuyez sur le bouton F1, puis tapez "Basculer l'affichage des espaces blancs" ou ses parties dont vous pouvez vous souvenir :)

J'utilise vscode version 1.22.2, donc cela pourrait être une fonctionnalité qui n'existait pas en 2015.

4
Stevelot

Pour que le diff affiche un espace similaire à git diff, définissez diffEditor.ignoreTrimWhitespace sur false. edit.renderWhitespace n'est que marginalement utile.

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

Pour mettre à jour les paramètres, allez à

Fichier> Préférences> Paramètres utilisateur

Remarque pour les utilisateurs de Mac: le menu Préférences est sous Code pas Fichier. Par exemple, Code> Préférences> Paramètres utilisateur.

Cela ouvre un fichier intitulé "Paramètres par défaut". Développez la zone //Editor. Vous pouvez maintenant voir où se trouvent tous ces mystérieux paramètres editor.*. Recherchez (CTRL + F) pour renderWhitespace. Sur ma boîte j'ai:

// 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",

Pour ajouter à la confusion, la "(Paramètres par défaut) de la fenêtre à gauche" n'est pas modifiable. Vous devez les remplacer en utilisant la fenêtre droite intitulée "settings.json". Vous pouvez copier les paramètres de collage de "Paramètres par défaut" dans "settings.json":

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

J'ai fini par désactiver renderWhitespace.

4
P.Brian.Mackey

L'option permettant de rendre les espaces visibles apparaît désormais en tant qu'option dans le menu Affichage, sous la forme "Activer/désactiver l'affichage des espaces" dans la version 1.15.1 de Visual Studio Code.

4
Dragonthoughts

  1. Ouvrir les préférences de l'utilisateur. Raccourci clavier: CTR + SHIFT + P -> Préférences: Ouvrir les paramètres utilisateur;

  2. Insérer dans le champ de recherche Espace blanc et sélectionner tout paramètre enter image description here

2
Andrey Patseiko

Mise à jour pour v1.37: ajout de l'option permettant de rendre les espaces uniquement dans le texte sélectionné. Voir notes de version v1.37, rendu des espaces .

Le paramètre editor.renderWhitespace prend désormais en charge une option selection. Lorsque cette option est définie, les espaces ne seront affichés que sur le texte sélectionné:

"editor.renderWhitespace": "selection"

et

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

demo of whitespace render in selection

2
Mark