¿Es posible mostrar caracteres de espacio en blanco, como el carácter de espacio, en Visual Studio Code?

No parece haber una opción para ello en settings.json(aunque es una opción en Atom.io ), y no he podido mostrar caracteres de espacio en blanco usando CSS.

Código VS 1.6.0 y superior

Como se menciona por aloisdg a continuación , editor.renderWhitespaceahora es una enumeración tomando none, boundaryo all. Para ver todos los espacios en blanco:

"editor.renderWhitespace": "all", 

Antes del código VS 1.6.0

Antes de 1.6.0, tenía que configurar editor.renderWhitespacea true:

"editor.renderWhitespace": true

También se puede hacer a través del menú principal. View -> Render Whitespace

ACTUALIZACIÓN (junio de 2019)

Para aquellos dispuestos a alternar caracteres de espacios en blanco usando un atajo de teclado, puede agregar fácilmente una combinación de teclas para eso.

En las últimas versiones de Visual Studio Code ahora hay una interfaz gráfica fácil de usar (es decir, no es necesario escribir datos JSON, etc.) para ver y editar todos los atajos de teclado disponibles. Todavía está bajo

Archivo> Preferencias> Atajos de teclado (o use Ctrl+ K Ctrl+ S)

También hay un campo de búsqueda para ayudar a encontrar (y filtrar) rápidamente las combinaciones de teclas deseadas. Entonces, tanto agregar nuevas como editar las combinaciones de teclas existentes es mucho más fácil:

Alternar caracteres de espacio en blanco no tiene una combinación de teclas predeterminada, así que siéntase libre de agregar uno. Simplemente presione el +signo en el lado izquierdo de la línea relacionada (o presione Enter, o haga doble clic en cualquier lugar de esa línea) e ingrese la combinación deseada en la ventana emergente.

Y si la combinación de teclas que ha elegido ya se usa para alguna otra acción, habrá una advertencia conveniente en la que puede hacer clic y observar qué acción (s) ya utiliza su combinación de teclas elegida:

Como puede ver, todo es muy intuitivo y conveniente.
Buen trabajo, Microsoft!

Respuesta original (antigua)

Para aquellos que deseen alternar caracteres de espacios en blanco utilizando un método abreviado de teclado , puede agregar un enlace personalizado al archivo keybindings.json ( Archivo> Preferencias> Métodos abreviados de teclado ).

Ejemplo :

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

Aquí he asignado una combinación de Ctrl+ Shift+ ipara alternar caracteres invisibles, por supuesto, puede elegir otra combinación.

Mostrar caracteres de espacio en blanco en Visual Studio Code

cambie el setting.json, agregando los siguientes códigos!

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

así como así
(PD: ¡no hay una opción "verdadera" ! Incluso funciona).

Sólo para demostrar los cambios que editor.renderWhitespace : none||boundary||allva a hacer a su VSCode añadí captura de pantalla:
.

Donde Tabestan →y Spaceestan.

Ya no es un boolean. Cambiaron a un enum. Ahora podemos elegir entre: none, boundary, y 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",

Puedes ver la diferencia original en GitHub .

* Actualización de la versión de febrero de 2020 * consulte https://github.com/microsoft/vscode/issues/90386

En v1.43, el valor predeterminado cambiaráselection de nonecomo estaba en v1.42.

"editor.renderWhitespace": "selection"  // default in v1.43

Actualización para v1.37: agregar la opción para representar espacios en blanco solo dentro del texto seleccionado. Consulte las notas de la versión v1.37, renderizar espacios en blanco .

La editor.renderWhitespaceconfiguración ahora admite una selectionopción. Con esta opción establecida, el espacio en blanco se mostrará solo en el texto seleccionado:

"editor.renderWhitespace": "selection"

y

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

Para que el diff muestre espacios en blanco de manera similar a git diffset diffEditor.ignoreTrimWhitespaceen false. edit.renderWhitespacees solo marginalmente útil.

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

Para actualizar la configuración, vaya a

Archivo> Preferencias> Configuración de usuario

Nota para usuarios de Mac: el menú Preferencias se encuentra en Código, no en Archivo. Por ejemplo, Código> Preferencias> Configuración de usuario.

Esto abre un archivo titulado "Configuración predeterminada". Expande el área //Editor. Ahora puede ver dónde se encuentran todas estas editor.*configuraciones misteriosas . Busque (CTRL + F) para renderWhitespace. En mi caja tengo:

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

Para aumentar la confusión, la ventana izquierda "Configuración predeterminada" no es editable. Debe anularlos utilizando la ventana derecha titulada "settings.json". Puede copiar la configuración de pegado de "Configuración predeterminada" a "settings.json":

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

Terminé apagándome renderWhitespace.

La opción para hacer que el espacio en blanco sea visible ahora aparece como una opción en el menú Ver, como "Activar o desactivar espacio en blanco" en la versión 1.15.1 de Visual Studio Code.

Presiona el botón F1, luego escribe "Toggle Render Whitespace" o las partes que puedas recordar :)

Utilizo vscode versión 1.22.2, por lo que esta podría ser una característica que no existía en 2015.

1. Abrir las preferencias del usuario. Atajo de teclado: CTR + SHIFT + P-> Preferencias: Abrir configuración de usuario;

2. Inserte en el campo de búsqueda Espacio en blanco y seleccione todos los parámetros