Qual é o atalho no Visual Studio Code para console.log


Respostas:


170

Atualização em fevereiro de 2019:

Conforme sugerido por Adrian Smith e outros: Se quiser vincular um atalho de teclado para criar uma instrução de log do console, você pode fazer o seguinte:

  1. Arquivo> Preferências> Atalhos de teclado
  2. Abaixo da barra de pesquisa, você verá uma mensagem "Para personalizações avançadas, abra e edite keybindings.json" , clique nela
  3. Adicione isso às configurações JSON:
{
  "key": "ctrl+shift+l",
  "command": "editor.action.insertSnippet",
  "when": "editorTextFocus",
  "args": {
    "snippet": "console.log('${TM_SELECTED_TEXT}$1')$2;"
  }
}

Pressionar CTRL+ SHIFT+ Lproduzirá o snippet do console. Além disso, se você já tiver o texto selecionado, ele será colocado dentro da instrução de log.


Se você preferir intelisene / autocomplete:

Vá para Preferências -> Trechos do usuário -> Escolha Texto digitado (ou qualquer idioma que você quiser). Um jsonarquivo deve ser aberto. Você pode adicionar trechos de código lá.

Já existe um snippet para console.logcomentado:

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

Você tem que fazer isso para cada idioma em que deseja usar o snippet ... é meio chato.


Além disso, você deve definir "editor.snippetSuggestions": "top" , para que seus trechos apareçam acima do intellisense. Obrigado @Chris!

Você pode encontrar sugestões de snippet em Preferências -> Editor de Texto -> Sugestões


2
Isso costumava funcionar, mas não funciona mais, desde a última atualização, talvez? Sou apenas eu? s17.postimg.org/5mxnx4umn/2017_02_14_11h10_03.jpg
Cristian Muscalu

O prefixo definido acima é "log", então digitar "c" não ajudará;) Comece a digitar "l".
Sebastian Sebald

Ah, esqueci de dizer que mudei para trabalhar com "c". Não mudei nada, e após a atualização não está mais funcionando. Não tenho mais o snippet, mas isso "prefix": "c",deve fazer com que funcione com "c" certo?
Cristian Muscalu

Se tudo mais estiver correto. Sim. Observe que você também precisa adicionar o snippet a cada idioma em que deseja usá-lo. Portanto, se você o adicionou ao TS, ele não funcionará em JS, vice-versa.
Sebastian Sebald

1
Você também pode clicar no {}botão ao lado da barra de pesquisa para abrir o keybindings.jsonarquivo - maneira mais fácil, pois não consegui ver a mensagem "Para personalizações avançadas, abra e edite keybindings.json" !
Aashish Chaubey

53

Todas as respostas acima funcionam bem, mas se você não quiser alterar a configuração do código do Visual Studio, ao invés do preenchimento automático, console.log(object); você pode simplesmente usar este atalho clg e pressionar Ctrl+ Spacepara sugestão e clicar em Enter
Nota : Este recurso está disponível ao instalar a extensão de snippets de código JavaScript (ES6).

Da mesma forma, você tem preenchimento automático 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 paraconsole.count(label);

    (Esta lista continua ...)

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

insira a descrição da imagem aqui


5
Perfeito. +1. Isso é o que eu estava procurando - não ter que fazer nenhuma alteração de configuração.
Chris22

39

A principal resposta de @Sebastian Sebald está perfeitamente bem, mas encontrando um problema semelhante (não console.log especificamente, mas sim "ausente"), eu também queria contribuir com uma resposta.

Seu prefixo está realmente funcionando - por padrão, é loge, no seu caso, você o alterou para c. Quando você digita log(ouc ), o VSCode gera uma lista completa de "todas as coisas ™" com base em muitos fatores (ou seja, não sei quais fatores, provavelmente relevância de classe).

Coisas como fragmentos tendem a gravitar em direção ao fundo. Para empurrá-los para o topo, apesar de seu comprimento, adicione às suas configurações:

"editor.snippetSuggestions": "top"

3
Você é o herói de que eu precisava. Obrigado!
BinarySolo

1
Haha, não se preocupe
Chris

Property editor.snippetSuggestions is not allowedPorém, recebo uma mensagem de erro dizendo , do que se trata?
Bossan

@Bossan "editor.snippetSuggestions": "top"deve ser colocado no arquivo settings.json ( ctrl+shift+pe tipo user settings) Como alternativa, você pode pesquisar por esta propriedade nas configurações gerais do usuário (Preferências> Configurações) e usar o menu suspenso para alterá-la para top.
Bordéus

29

Digite loge aperte enter. Será completado automaticamenteconsole.log();


Parece que tenho um bug em que digitar loge pressionar Enter só sai console.log();em algumas ocasiões, e não consigo descobrir por quê? Sou só eu ou outras pessoas podem logdigitar e obter uma console.log();saída consistente sempre?
Ben Clarke

2
Você tem que esperar alguns milissenconds / segundos para que a linha de comando reconheça o que você digitou. às vezes demora um pouco
nedemir

24

No Atom, há um bom atalho para console.log () e eu queria o mesmo no VS Code.

Usei a solução de @kamp, mas demorei um pouco para descobrir como fazer. Aqui estão as etapas que usei.

  1. Vá para: Arquivo> Preferências> Atalhos de teclado

  2. No topo da página, você verá uma mensagem que diz: Para personalizações avançadas, abra e edite keybindings.json

Clique no link

  1. Isso abre dois painéis: os atalhos de teclado padrão e seus atalhos personalizados.

Insira o código no painel direito

  1. Digite o código fornecido por @kamp

Obrigado pelas etapas detalhadas
Moaaz Bhnas

23

Outra maneira é abrir o arquivo keybindings.json e adicionar a combinação de teclas desejada. No meu caso é:

{
    "key": "cmd+shift+l",
    "command": "editor.action.insertSnippet",
    "when": "editorTextFocus",
    "args": {
      "snippet": "console.log($1)$0;"
    }
}

"ctrl + shift + c" para a "chave" é um pouco mais fácil de clicar com uma mão IMO e ainda não é usado por outro atalho de teclado se você estiver usando os atalhos de teclado padrão vs código
russiansummer

15

Qualquer pessoa procurando por personalizações avançadas, abra e edite keybindings.json

insira a descrição da imagem aqui

Clique neste pequeno ícone para abrir keybindings.json.

Use este código para gerar console.log () e para gerar console.log ("Word") para o texto selecionado.

{
  "key": "ctrl+shift+l",
  "command": "editor.action.insertSnippet",
  "when": "editorTextFocus",
  "args": {
    "snippet": "console.log('${TM_SELECTED_TEXT}$1')$2;"
  }
}

1
obrigado, no mac tive que ir em code-> preferências-> atalhos de teclado e depois clicar nesse botão, depois colocar o {...} dentro do array.
rdprado de

1
obrigado cara, alguém deve atualizar a resposta aceita para que todos possam pular 10 minutos de pesquisa
Kris Lamote

1
U economizou muito tempo, cara !! Obrigado
React Developer

Isso não está lá no meu mac. Eu precisava fazer cmd + shift + p e, em seguida, pesquisar atalhos de teclado (JSON)
martinedwards de

10

Ao digitar a palavra log , você verá algo assim:

Escolher o método que diz Log para o console

Escolha aquele que diz Log para o console no caso de você ver diferentes opções de log (isso basicamente seria possível quando você tivesse algum identificador com o log de nomes.

Clique em Enter.

console.log () digitado automaticamente!

O intellisense fará o seu trabalho!


9

Caso alguém esteja interessado em inserir o texto atualmente selecionado na console.log()declaração:

{
    "key": "cmd+shift+l",
    "command": "editor.action.insertSnippet",
    "when": "editorTextFocus",
    "args": {
      "snippet": "console.log(${TM_SELECTED_TEXT}$1)$0;"
    }
}

Isso é incrível!
AJ Hsu

9

Digite 'clg' e, em seguida, pressione ctrl+ spacee pressione enterpara concluir automaticamente para console.log().
Para isso, você só precisa instalar uma extensão, ou seja, trechos de código JavaScript (ES6).


Também 'cwa' para console.warn ()
Amir Shabani

8

clg + tab

ou como mencionado acima,

log + enter (segunda opção no menu suspenso)

Esta é uma pergunta antiga, mas espero que seja útil para outra pessoa.


clg + tab dá ChannelMergerNodepara mim!
jb

Acho que você precisa editar seus atalhos de teclado conforme mencionado nas respostas acima;)
palmaone

2

O abaixo é o texto selecionado atualmente com aspas simples. Espero que ajude

// 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;"
    }

}]

2

Aqui está uma solução melhor

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

2

Não sei qual extensão estou usando, mas simplesmente digito log e clico em tab para autocompletar console.log (); colocando o cursor entre as chaves.


1

Digite coe pressione tabou enter.

Deve funcionar fora da caixa.


Acho que isso pode não ser muito confiável ou depende de extensões. Para mim, co + enter gera apenas a saída de texto e co + tab gera "confirmar". Mesmo "contras" + guia apenas gera "console".
Joel Peltonen

0

Como alternativa, você pode criar uma função fácil de escrever que invoque o console.log e, em seguida, basta chamar essa função.

 var a = funtion (x) {console.log(x)}
 a(2*2);        //prints 4

1
Isso não está respondendo à pergunta do OP, já que isso teria que ser importado em todos os projetos e é apenas um incômodo direto. Ter um atalho de teclado embutido é definitivamente o caminho certo aqui
Sweet Chilly Philly
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.