¿Cuál es el acceso directo en Visual Studio Code para console.log?

Respuestas:

170

Actualización de febrero de 2019:

Como lo sugirieron Adrian Smith y otros: si desea vincular un atajo de teclado para crear una declaración de registro de la consola, puede hacer lo siguiente:

  1. Archivo> Preferencias> Atajos de teclado
  2. Debajo de la barra de búsqueda, verá un mensaje "Para personalizaciones avanzadas, abra y edite keybindings.json" , haga clic en él.
  3. Agregue esto a la configuración de JSON:
{
  "key": "ctrl+shift+l",
  "command": "editor.action.insertSnippet",
  "when": "editorTextFocus",
  "args": {
    "snippet": "console.log('${TM_SELECTED_TEXT}$1')$2;"
  }
}

Al presionar CTRL+ SHIFT+ se Lgenerará el fragmento de la consola. Además, si ya ha seleccionado texto, se colocará dentro de la declaración de registro.


Si prefiere intellisene / autocompletar:

Vaya a Preferencias -> Fragmentos de usuario -> Elija TypeScript (o el idioma que desee). jsonDebería abrirse un archivo. Puede agregar fragmentos de código allí.

Ya hay un fragmento de console.logcomentario:

"Print to console": {
    "prefix": "log",
    "body": [
        "console.log('$1');",
        "$2"
    ],
    "description": "Log output to console"
}

Tienes que hacer esto para cada idioma en el que quieras usar el fragmento ... es un poco molesto.


Además, debe configurar "editor.snippetSuggestions": "top", para que sus fragmentos aparezcan encima de intellisense. ¡Gracias @Chris!

Puede encontrar sugerencias de fragmentos en Preferencias -> Editor de texto -> Sugerencias

Sebastián Sebald
fuente
3
Esto solía funcionar, pero ya no funciona, ¿desde la última actualización tal vez? ¿Se trata sólo de mí? s17.postimg.org/5mxnx4umn/2017_02_14_11h10_03.jpg
Cristian Muscalu
El prefijo definido anteriormente es "log", por lo que escribir "c" no ayudará;) Empiece a escribir "l" en su lugar.
Sebastian Sebald
Oh, olvidé mencionar que lo había cambiado para trabajar con "c". No cambié nada y, después de la actualización, ya no funciona. Ya no tienes el fragmento, pero esto "prefix": "c",debería hacer que funcione con "c", ¿verdad?
Cristian Muscalu
Si todo lo demás es correcto. Si. Tenga en cuenta que también debe agregar el fragmento a cada idioma en el que desea usarlo. Entonces, si lo agregó a TS, no funcionará en JS, viceversa.
Sebastian Sebald
1
Alternativamente, puede hacer clic en el {}botón junto a la barra de búsqueda para abrir el keybindings.jsonarchivo. La forma más fácil, ya que no pude ver el mensaje "Para personalizaciones avanzadas, abra y edite keybindings.json" .
Aashish Chaubey
55

Todas las respuestas anteriores funcionan bien, pero si no desea cambiar la configuración del código de Visual Studio, sino que desea la finalización automática, console.log(object); simplemente puede usar este acceso directo clg y presionar Ctrl+ Spacepara una sugerencia y presionar Enter
Nota : Esta función está disponible cuando instala la extensión de fragmentos de código JavaScript (ES6).

De manera similar, tiene autocompletado para:

  • clg paraconsole.log(object);
  • clo paraconsole.log('object :', object);
  • ccl paraconsole.clear(object);
  • cer paraconsole.error(object);
  • ctr para console.trace(object);
  • clt paraconsole.table(object);
  • cin paraconsole.info(object);
  • cco para console.count(label);

    (Esta lista continúa ...)

enlace para fragmentos de código JavaScript (ES6): https://marketplace.visualstudio.com/items?itemName=xabikos.JavaScriptSnippets

ingrese la descripción de la imagen aquí

Sabunkar Tejas Sahailesh
fuente
5
Perfecto. +1. Esto es lo que estaba buscando: no tener que hacer ningún cambio de configuración.
Chris22
39

La respuesta principal de @Sebastian Sebald está perfectamente bien, pero con un problema similar (no específicamente en console.log, sino que "falta"), también quería contribuir con una respuesta.

De hecho, su prefijo funciona; de forma predeterminada, logy en su caso lo ha cambiado a c. Cuando escribe log(o c) VSCode generará una lista completa de "todas las cosas ™" basada en muchos factores (es decir, no sé qué factores, probablemente la relevancia de la clase).

Cosas como fragmentos tienden a gravitar hacia el fondo. Para subirlos a la parte superior, a pesar de su longitud, agregue esto a su configuración:

"editor.snippetSuggestions": "top"
Chris
fuente
3
Eres el héroe que necesitaba. ¡Gracias!
BinarySolo
1
Jaja, no te preocupes en absoluto
Chris
Sin Property editor.snippetSuggestions is not allowedembargo, aparece un error que dice , ¿de qué se trata?
Bossan
@Bossan "editor.snippetSuggestions": "top"debe colocarse en el archivo settings.json ( ctrl+shift+py escriba user settings). Alternativamente, puede buscar esta propiedad en la configuración general del usuario (Preferencias> Configuración) y usar el menú desplegable para cambiarla a top.
burdeos
29

Escribe logy pulsa enter. Se completará automáticamenteconsole.log();

nedemir
fuente
Parece que tengo un error en el que escribir logy presionar Intro solo genera salidas console.log();en algunas ocasiones, y no puedo entender por qué. ¿Soy solo yo o pueden otros escribir y logluego ingresar y obtener una console.log();salida consistente cada vez?
Ben Clarke
2
Tienes que esperar unos milisenconds / segundos para que la línea de comando regoneice lo que has escrito. a veces se retrasa un poco
nedemir
24

En Atom hay un buen atajo para console.log () y quería lo mismo en VS Code.

Usé la solución de @kamp pero me tomó un tiempo descubrir cómo hacerlo. Estos son los pasos que utilicé.

  1. Vaya a: Archivo> Preferencias> Atajos de teclado

  2. En la parte superior de la página, verá un mensaje que dice: Para personalizaciones avanzadas, abra y edite keybindings.json

Haga clic en el enlace

  1. Esto abre dos paneles: las combinaciones de teclas predeterminadas y sus combinaciones personalizadas.

Ingrese el código en el panel derecho

  1. Ingrese el código proporcionado por @kamp
Adrian Smith
fuente
Gracias por los pasos detallados
Moaaz Bhnas
23

Otra forma es abrir el archivo keybindings.json y agregar la combinación de teclas deseada. En mi caso es:

{
    "key": "cmd+shift+l",
    "command": "editor.action.insertSnippet",
    "when": "editorTextFocus",
    "args": {
      "snippet": "console.log($1)$0;"
    }
}
kamp
fuente
"Ctrl + Shift + C" para la "llave" es un poco más fácil hacer clic con un lado de la OMI y no es ya tomada por otra combinación de teclas si el uso de la opción predeterminada vs combinaciones de teclas de código
russiansummer
15

Cualquiera que busque personalizaciones avanzadas abra y edite keybindings.json

ingrese la descripción de la imagen aquí

Haga clic en este pequeño icono para abrir keybindings.json.

Utilice este código para generar tanto console.log () como para generar console.log ("Word") para el texto seleccionado.

{
  "key": "ctrl+shift+l",
  "command": "editor.action.insertSnippet",
  "when": "editorTextFocus",
  "args": {
    "snippet": "console.log('${TM_SELECTED_TEXT}$1')$2;"
  }
}
Hiran DA Walawage
fuente
1
gracias, en Mac tuve que ir a código-> preferencias-> atajos de teclado y luego hacer clic en ese botón, luego poner el {...} dentro de la matriz.
rdprado
1
gracias hombre, alguien debería actualizar la respuesta aceptada para que todos los demás puedan omitir 10 minutos de búsqueda
Kris Lamote
1
¡Ahorraste mucho tiempo, hombre! Gracias
React Developer
Esto no está en mi mac. Necesitaba hacer cmd + shift + py luego buscar atajos de teclado (JSON)
martinedwards
10

Cuando escriba el registro de palabras , verá algo como esto:

Elegir el método que dice Iniciar sesión en la consola

Elija el que dice Iniciar sesión en la consola en caso de que vea diferentes opciones de registro (eso sería básicamente posible cuando tenga algún identificador con el nombre de registro.

Haga clic en Entrar.

console.log () escrito automáticamente!

¡El intellisense hará su trabajo!

Srishti
fuente
9

En caso de que alguien esté interesado en poner el texto seleccionado actualmente en la console.log()declaración:

{
    "key": "cmd+shift+l",
    "command": "editor.action.insertSnippet",
    "when": "editorTextFocus",
    "args": {
      "snippet": "console.log(${TM_SELECTED_TEXT}$1)$0;"
    }
}
hacer cosas
fuente
¡Esto es asombroso!
AJ Hsu
9

Escribe 'clg', luego presiona ctrl+ spacey presiona enter, se completará automáticamente en console.log().
Para ello, solo necesita instalar una extensión, es decir, fragmentos de código JavaScript (ES6).

Waleed Shahzaib
fuente
También 'cwa' para console.warn ()
Amir Shabani
8

clg + tab

o como se mencionó anteriormente,

log + enter (segunda opción en el menú desplegable)

Esta es una pregunta antigua, pero espero que sea útil para alguien más.

palmaone
fuente
clg + tab da ChannelMergerNodepara mí!
jb
Creo que necesita editar sus combinaciones de teclas como se menciona en las respuestas anteriores;)
palmaone
2

El siguiente es texto seleccionado actualmente con comillas simples. Espero eso ayude

// Place your key bindings in this file to overwrite the defaults
[{
    "key": "ctrl+shift+c",
    "command": "editor.action.insertSnippet",
    "when": "editorTextFocus",
    "args": {
        "snippet": "console.log('${TM_SELECTED_TEXT}$1')$2;"
    }

}]
Ragavan Rajan
fuente
2

Aquí hay una mejor solución

{
        "key": "cmd+shift+c",
        "command": "editor.action.insertSnippet",
        "when": "editorTextFocus",
        "args": {
            "snippet": "console.log('${TM_SELECTED_TEXT}', $TM_SELECTED_TEXT$1);"
        }
    }
Param Singh
fuente
2

No sé qué extensión estoy usando, pero simplemente escribo log y presiono tabulador para autocompletar console.log (); colocando el cursor entre las llaves.

Ryan
fuente
1

Escribe coy presiona tabo enter.

Debería funcionar fuera de la caja.

Marek W
fuente
Creo que esto podría no ser muy confiable o depender de extensiones. Para mí, co + enter genera solo la salida de texto y la pestaña co + genera "confirmar". Incluso la pestaña "contras" + solo genera "consola".
Joel Peltonen
0

Como alternativa, puede crear una función fácil de escribir que invoca el archivo console.log y luego simplemente llamar a esa función.

 var a = funtion (x) {console.log(x)}
 a(2*2);        //prints 4
zazadada
fuente
1
Esto no responde a la pregunta del OP, ya que tendría que importarse en cada proyecto y es simplemente una molestia. Tener una combinación de teclas incorporada es definitivamente el camino a seguir aquí
Sweet Chilly Philly