Testes 및 Vue usando VSCode의 제품

Criar testes bem organizados, separados e com uma boa descrição no Jest ou inserir toda estrutura inicial padrão de um componente Vue, pode ser verboso. Mas configurando o VS Code é possível inserir automaticamente toda pré-estrutura com a escrita de apenas uma palavra.

Desenvolvendo com o Visual Studio Code você pode turbinar sua produtividade de uma forma muito simples com Snippets!

코모 기능?

Os snippets salvos no seu VS Code geram códigos pré-definidos ao digitar uma determinada palavra escolhida na sua configuração.

Como criar 음 스니펫

Com o VS Code aberto vá em File -> Preferences -> Configure User Snippets

Na paleta de comandos aberta digite a linguagem para qual deseja exibir o snippet, no caso de testes Jest digite typescript se for sua linguagem utilizada.

aberto um arquivo typescript.json com instruções para criar seu snippet.

Cada snippet tem a seguinte estrutura:

"Nome do Snippet": {
        "prefix": // Palavra que chama o snippet,
        "body": [
            // Corpo com o código a ser gerado         
        ],
        "description": // Descrição com detalhes do código
},

Ao escrever o body, em linhas que houver indentação use \t 필수 항목에 대한 적용이 필요합니다. 카다 \t 대표 음 탭.

Para indicar as pausas do Tab para digitação de texto pelo código use $1 , número pela ordem de inserção desejada em cada trecho로 대체합니다.

Também é possível indicar o tipo de conteúdo a ser inserido em cada pausa com ${1:conteudo} dando uma ideia do que escrever. E para definir um texto igual a ser usado em várias partes do código use o mesmo número de ID em todas partes que o texto for repetir.

Abaixo montei um snippet completo para Jest usando BDD que você pode aproveitar nos seus códigos ou adaptar como preferir:

O snippet de Vue é para uso com composition Api usando Typescript e Sass scoped, mas você pode adaptar como preferir:

O artigo é para produtividade com Testes e Vue, mas também é possível criar snnippets para outras linguagens.

Espero ter ajudado! 😊