code formatting - there - ¿Cómo formatea el código en Visual Studio Code(VSCode)?

visual studio code format php

Question

Esta publicación es un Wiki de la comunidad . Edite las respuestas existentes para mejorar esta publicación. Actualmente no acepta nuevas respuestas. here

¿Cuál es el equivalente de Ctrl + K + F y Ctrl + K + D en Windows en Visual Studio para formatear o "embellecer" el código en el editor de código de Visual Studio?

Answer 1

1. Haga clic derecho en el archivo
2. Seleccione Formatear documento ( Alt + Shift + F , o Alt + Shift + I en Linux) del cuadro de menú.

Answer 2

Código de Visual Studio en Linux:

Ctrl + [ al bloque de código no sangrado y

Ctrl + ] para hacer una sangría masiva

Answer 3

Código de formato en Visual Studio.

He intentado formatear en Windows 8.

Solo sigue las capturas de pantalla a continuación.

1. Haga clic en Ver en la barra de menú superior y luego haga clic en Paleta de comandos.

2. Luego aparecerá un cuadro de texto donde necesitamos escribir Formato

   Shift + Alt + F

Answer 4

El acceso directo de formato en C # no funcionó para mí hasta que instalé Mono para Mac OS X, DNVM y DNVM .

Antes de instalar Mono, el acceso directo de formato automático ( Shift + Alt + F ) solo funcionaba para los archivos .json .

Answer 5

El formato del código está disponible en Visual Studio Code a través de los siguientes accesos directos:

• En Windows Shift + Alt + F
• En Mac Shift + Opción + F
• En Ubuntu Ctrl + Shift + I

Alternativamente, puede encontrar el acceso directo, así como otros accesos directos, a través de la funcionalidad de búsqueda proporcionada en el editor con Ctrl + Shift + P (o Comando + Shift + P en Mac), y luego buscar el documento de formato .

Answer 6

En Linux es Ctrl + Shift + I.

En Windows es Alt + Shift + F . Probado con HTML / CSS / JavaScript y Visual Studio Code 1.18.0.

Para otros idiomas, es posible que deba instalar un paquete de idioma específico.

Answer 7

En Mac, Shift + Alt + F funciona para mí.

Siempre puede verificar las combinaciones de teclas en el menú:

Menú Archivo → Preferencias → Atajos de teclado y filtro por palabra clave ''formato''.

Answer 8

En Mac, use ⌘ + K y luego ⌘ + F.

Answer 9

En Ubuntu es Ctrl + Shift + I.

Answer 10

En Visual Studio Code, Shift + Alt + F está haciendo lo que Ctrl + K + D está haciendo en Visual Studio.

Answer 11

Este no. Utilizar este:

Archivo de menú → Preferencias → Configuración del espacio de trabajo , "editor.formatOnType" : verdadero

Answer 12

La combinación de teclas correcta es Shift + Alt + F.

Answer 13

La forma más simple que uso en Visual Studio Code (Ubuntu) es:

Seleccione el texto que desea formatear con el mouse.

Haga clic derecho y elija "Selección de formato" .

Answer 14

Para Fedora

1. Haga clic en File -> Preferences -> Keyboard shortcuts .
2. En Default Keyboard Shortcuts , busque ( Ctrl + F ) para editor.action.format .

La mía leyó "key": "ctrl+shift+i"

Puedes cambiarlo también. Consulte share sobre cómo ... o si se siente un poco flojo al desplazarse hacia arriba:

Puede agregar una combinación de teclas en "Preferencias-> Atajos de teclado"

{ "key": "cmd+k cmd+d", "command": "editor.action.format" }

O Visual Studio como:

{ "key": "ctrl+k ctrl+d", "command": "editor.action.format" }

Tenga en cuenta: la tecla cmd es solo para Mac. Para Windows y Fedora (teclado de Windows) use Ctrl

EDITAR :

Según Visual Code versión 1.28.2 esto es lo que encontré.

editor.action.format ya no existe. Ahora ha sido reemplazado por editor.action.formatDocument y editor.action.formatSelection .

Escriba editor.action.format en el cuadro de búsqueda para ver los accesos directos existentes.

Para cambiar las combinaciones de teclas, siga estos pasos:

1. Haga clic en editor.action.formatDocument o editor.action.formatSelection
2. A la izquierda aparece un ícono similar a un bolígrafo: haga clic en él.
3. Aparece una ventana emergente. Presione la combinación de teclas deseada y presione Entrar.

Answer 15

Para aquellos que quieran personalizar qué archivos JavaScript formatear, pueden usar cualquier extensión en la propiedad JSfiles . Lo mismo se aplica a HTML.

{
    "beautify.onSave": true,
    "beautify.JSfiles": ["js", "json", "jsbeautifyrc", "jshintrc", "ts"],
    "beautify.HTMLfiles": ["htm", "html"]
}

Esto permitirá embellecer al guardar para TypeScript, y puede agregar XML a la opción HTML.

Answer 16

Por alguna razón, Alt + Shift + F no funcionó para mí en Mac Visual Studio Code 1.3.1, y en realidad el comando "Formatear documento" no funcionó en absoluto. Pero el comando Formatter funcionó muy bien.

Por lo tanto, puede usar Comando + Mayús + P y escribir Formatter o hacer su propio acceso directo en el menú Archivo → Preferencias → Atajos de teclado → Comando + K Comando + S, luego escriba Formatter y agregue su acceso directo.

Ver un ejemplo:

Answer 17

Por defecto, esta clave no me funcionaba en documentos HTML, CSS y JavaScript.

Después de buscar, encontré el popular plugin JS-CSS-HTML Formatter con 133,796 instalaciones .

Después de la instalación, simplemente vuelva a cargar las ventanas y presione Ctrl + Shift + F , ¡y funcionó!

Answer 18

Primero debe instalar el complemento apropiado (es decir, XML, C #, etc.).

El formato no estará disponible hasta que haya instalado el complemento correspondiente y guarde el archivo con una extensión adecuada.

Answer 19

Puede agregar una combinación de teclas en el menú Archivo → Preferencias → Métodos abreviados de teclado .

{ "key": "cmd+k cmd+d", "command": "editor.action.formatDocument" }

O Visual Studio como:

{ "key": "ctrl+k ctrl+d", "command": "editor.action.formatDocument" }

Answer 20

Seleccione el texto, haga clic derecho en la selección y seleccione la opción "paleta de comandos":

Se abre una nueva ventana. Busque "formato" y seleccione la opción que tenga formato según el requisito.

Answer 21

Si bien cambiar el comportamiento predeterminado para Visual Studio Code requiere una extensión, puede anular el comportamiento predeterminado en el espacio de trabajo o el nivel de usuario. Funciona para la mayoría de los lenguajes compatibles (puedo garantizar HTML, JavaScript y C #).

Nivel de espacio de trabajo

Beneficios

• No requiere una extensión
• Puede ser compartido entre equipos

Resultados

• .vscode/settings.json se crea en la carpeta raíz del proyecto

¿Cómo?

1. Vaya a: Archivo de menú → Preferencias → Configuración del espacio de trabajo

2. Agregue y guarde "editor.formatOnType": true a settings.json (que anula el comportamiento predeterminado para el proyecto en el que trabaja creando un archivo .vscode / settings.json).

Nivel de entorno del usuario

Beneficios

• No requiere extensión
• Ajustes de entorno de desarrollo personal para gobernarlos a todos (configuración :))

Resultados

• Se ha modificado settings.json del usuario (consulte la ubicación por sistema operativo a continuación)

¿Cómo?

1. Vaya a: menú Archivo → Preferencias → Configuración de usuario

2. Agregue o cambie el valor de "editor.formatOnType": false a "editor.formatOnType": true en la configuración de usuario.json

La ubicación de settings.json de su usuario de Visual Studio Code es:

Ubicaciones del archivo de configuración dependiendo de su plataforma, el archivo de configuración del usuario se encuentra aquí:

• Windows: %APPDATA%/Code/User/settings.json
• Mac: $HOME/Library/Application Support/Code/User/settings.json
• Linux: $HOME/.config/Code/User/settings.json El archivo de configuración del espacio de trabajo se encuentra debajo de la carpeta .vscode en su proyecto.

Más detalles se pueden encontrar here .

Answer 22

Si desea personalizar el estilo de formato de documento, debe utilizar la extensión Embellecer .

Consulte esta captura de pantalla:

Answer 23

Simplemente haga clic derecho en el texto y seleccione "Formatear código".

Visual Studio Code usa js-beautify internamente, pero carece de la capacidad de modificar el estilo que desea usar. La extensión "embellecer" le permite agregar configuraciones.

Answer 24

Simplemente instale Visual Studio Keymap de Microsoft. Problema resuelto. :pags

Answer 25

Usar extensión ...

Permite el formateo automático del código cuando guarda un archivo.

Inicie Visual Studio Code y Quick Open ( Ctrl + P ), pegue el siguiente comando y presione Entrar .

ext instalar formato al guardar

https://marketplace.visualstudio.com/items?itemName=gyuha.format-on-save

Answer 26

Visual Studio Code 1.6.1 admite " Formatear al guardar ", que recogerá automáticamente las extensiones de formateador relevantes instaladas y formateará todo el documento en cada guardado.

Habilite "Formatear al guardar" configurando

"editor.formatOnSave": true

Y hay atajos de teclado disponibles (Visual Studio Code 1.7 y superior):

Formatee todo el documento : Shift + Alt + F

Selección de formato solamente : Ctrl + K , Ctrl + F

Answer 27

Archivo de menú → Preferencias → Configuración

"editor.formatOnType": true

Cuando ingrese el punto y coma, se formateará.

Alternativamente, también puede usar "editor.formatOnSave": true .

Answer 28

Shift + Alt + F hace el trabajo bien en 1.17.2 y superior.

Answer 29

Atajo de formato de código:

Código de Visual Studio en Windows: Mayús + Alt + F

Visual Studio Code en MacOS - Shift + Opción + F

Código de Visual Studio en Ubuntu: Ctrl + Shift + I

También puede personalizar este acceso directo utilizando una configuración de preferencias si es necesario.

Formateo de código al guardar el archivo:

Visual Studio Code permite al usuario personalizar la configuración predeterminada.

Si desea formatear automáticamente su contenido mientras guarda, agregue el fragmento de código a continuación en la configuración del espacio de trabajo de Visual Studio Code.

Archivo de menú → Preferencias → Configuración del espacio de trabajo

{
    // Controls if the editor should automatically format the line after typing
    "beautify.onSave": true,

    "editor.formatOnSave": true,

    // You can auto format any files based on the file extensions type.
    "beautify.JSfiles": [
        "js",
        "json",
        "jsbeautifyrc",
        "jshintrc",
        "ts"
    ]
}

Nota: ahora puede formatear automáticamente archivos TypeScript. Mira mi actualización.