Melhore seu IDE com o Vim

A combinação perfeita para uma fantástica experiência de desenvolvimento

Kevin Kreuzer Blocked Unblock Seguir Seguindo 10 de janeiro

Por um longo tempo, tenho escutado as pessoas jorrando sobre o Vim. Eu sempre respeitei a opinião deles, mas no final, ainda me recusei a dar uma chance ao Vim.

Minhas experiências com o Vim foram muito dolorosas. Era surreal imaginar como isso poderia aumentar minha produtividade.

Depois de ouvir outro entusiasta do Vim, eu finalmente arregaço as mangas e decidi dar uma chance ao Vim. Guess E adivinhe – foi uma excelente decisão.

Não me entenda mal.

Eu não sou um usuário hardcore do Vim que conhece todos os comandos e tem muitos plugins instalados. Eu também não gostaria de codificar com o Vim simples.

Mas combinado com um IDE de sua escolha, o Vim é uma ferramenta perfeita!

Começando com o Vim ?

Para começar com o Vim, eu primeiro levei algumas horas para percorrer o tutor do Vim.

Vim tutor é o tutorial interativo para iniciantes do Vim. Para iniciar este tutorial, basta abrir um terminal e digitar vimtutor .

O tutor do Vim me deu uma primeira impressão de como o Vim pode ser poderoso se você dominá-lo. Por outro lado, eu também aprendi que vai levar algum tempo para se acostumar com os diferentes modos.

Após as primeiras horas, percebi que o Vim não contém uma curva de aprendizado, é mais uma parede. ?

Mas isso não deve quebrar minha motivação.

A perspectiva de muito mais eficiência, bem como o desejo de conhecer Vim para poder julgá-lo com base em minhas próprias experiências, me fez continuar.

Para me familiarizar com o Vim, eu precisava de mais do que apenas o Tutor. Eu reconheci que há apenas uma maneira de aprender Vim.

Eu decidi incluir o Vim no meu fluxo de trabalho diário por um mês.

Um mês em que eu estava preparado para ser menos produtivo e ter nervos estáveis. Claro, eu não contei ao meu product owner sobre meu plano glorioso.

Um ano e meio depois, o Vim ainda está integrado ao meu fluxo de trabalho diário, e eu nunca iria querer codificar sem ele. ?

Aqui está o porquê.

Porquê o Vim?

O principal argumento para o Vim é seu poder de edição de alta velocidade. Ele permite que você edite o texto de maneira intuitiva e poderosa.

O Vim contém muitas funcionalidades. Muitos para cobrir em um post no blog. Todos os dias eu uso o Vim. Eu aprendo algo novo ou leio sobre um novo recurso que eu nunca ouvi falar antes.

Este blog não é um tutorial do Vim – é sobre mostrar seu poder. Portanto, listarei apenas os recursos que mais uso.

Movendo o cursor em volta ?

Durante a codificação, geralmente movemos o cursor para navegar entre as linhas. Saltamos de linha para linha ou avançamos e recuamos para dentro deles.

Nós geralmente precisamos de nossas chaves de flecha para nos movermos, o que nos força a mover nossa mão inteira para longe de nossa posição atual.

Além disso, se você usar um novo MacBook, as teclas de seta (especialmente as teclas para cima e para baixo) serão pequenas.

O Vim nos permite navegar sem perder a posição atual da mão. Podemos nos movimentar rapidamente usando as teclas H , J , K e L

Este movimento pode parecer estranho em primeiro lugar. Mas acredite em mim quando você se acostumar com isso, é natural.

Siga-me no Twitter ou no meio para ser notificado sobre minhas novas postagens no blog! ?

Movimentos Avançados

Além dessas simples navegações para cima, baixo, esquerda e direita, o Vim nos oferece mais maneiras de navegar.

Podemos usar comandos para navegar. Principalmente, apenas um caractere é necessário para executar a navegação.

Então, vamos dar uma olhada na imagem a seguir, que visualiza alguns dos comandos. Uma operação é executada em relação à posição do cursor.

Enquanto os comandos acima são todos executados em uma linha, também existem comandos que nos permitem navegar em blocos ou no arquivo inteiro.

%

Pressione isso em um suporte. O cursor salta para o colchete de fechamento correspondente.

G

Salte para o final do arquivo.

gg

Salta para o começo de um arquivo.

Mover para um caractere específico ou palavra

Esse recurso é bastante impressionante, pois permite que você pule para posições personalizadas dentro de uma linha ou arquivo.

Para pular para uma letra, você pode digitar um dos seguintes comandos:

 f + caractere ou t + caractere 

Vamos primeiro dar uma olhada em alguns exemplos para ilustrar o que este comando faz. Dê uma olhada na próxima linha:

 The quick brown fox jumps over the lazy dog. 

Vamos dizer que nosso cursor está no começo da linha e queremos pular para o b de marrom.

Digitando fb colocaria o cursor em b

 The quick brown fox jumps over the lazy dog. 
^

tb colocaria o cursor antes de b

 The quick brown fox jumps over the lazy dog. 
^

Pesquisar com /

O Vim tem uma pesquisa integrada. Você pode procurar por qualquer palavra, digitando / seguido pela palavra. Com n você pode pular para o próximo resultado e com N volta para o jogo anterior.

Então, se você quiser hop ao own de brown fox basta digitar /own .

Operações do Vim

Copiar, cortar e colar comandos podem ser eficientemente executados com um toque de tecla no modo normal.

c

Use este comando para cortar a seleção atual e mudar para o modo de inserção.

d

Use este comando para excluir a seleção atual.

v

Use este comando para selecionar.

y (yank)

Use este comando para copiar.

p

cole a seleção atual

Combine operações com movimentos ?

Vim nos permite usar para combinar o que aprendemos acima. A combinação dessas coisas permite a edição de forma inovadora e única.

A combinação de comandos e movimentos é onde o Vim realmente brilha e supera a concorrência.

Então, vamos ter em um exemplo do mundo real para ilustrar como a combinação funciona. Vamos supor que temos o seguinte método:

 teste público (foo: string, bar: string): void {} 

Agora queremos mudar a assinatura do método, algo que usamos com bastante frequência durante a programação.

Assim, em qualquer IDE não-Vim habilitado, eu provavelmente pressionaria a tecla Shift em combinação com 23 teclas de seta para a esquerda.? Ou, pior ainda – eu usaria o mouse.

Então, vamos fazer o mesmo com o Vim e apenas três pressionamentos de tecla.

Nós combinamos o comando c e o comando t + character . Pressionando esta combinação de teclas, informamos ao Vim para cortar tudo até o ) e alternar para o modo de inserção.

É apenas um pequeno caso de uso do poder que esta ferramenta lhe oferece. Agora você pode combinar todos os movimentos e comandos.

Quer selecionar tudo, desde a posição atual até o final do arquivo? Ótimo! Apenas digite

Quer apagar o corpo do método? Pressione a seguinte combinação no { do corpo do método.

Quer copiar uma variável? Basta digitar o seguinte na variável:

E assim por diante. Você entendeu. ?

Você pode combinar todos esses comandos. A folha de dicas acima dá-lhe uma visão geral ainda melhor dos comandos e quão poderoso é o Vim.

Ative a força! Integre o Vim no seu IDE ?

A maioria dos IDEs permite que você tenha alguma emulação Vim. Não é possível cobrir a configuração de todos os IDEs – portanto, mostro como fazer isso no meu favorito, Webstorm! ?

Caso você use outro IDE, considere ler. Além da configuração, também observamos algumas dicas e truques que também podem ser úteis para o seu IDE.

Webstorm é um IDE tão poderoso com recursos e plugins maravilhosos. É uma ferramenta incrível. Combinando-o com o Vim, temos uma experiência de desenvolvimento única e fantástica.

Setup Vim em Webstorm

Para usar um Vim emulado dentro da Webstorm, vamos instalar o plugin IdeaVim .

IdeaVim é um plugin de emulação Vim para IDEs baseado na plataforma IntelliJ. O IdeaVim pode ser usado com o IntelliJ IDEA, o PyCharm, o CLion, o PhpStorm, o WebStorm, o RubyMine, o AppCode, o DataGrip, o GoLand, o Cursive e o Android Studio.

Para instalá-lo, vá para:

Webstorm> Preferências> Plugins> Navegar Repositórios

Procure por IdeaVim e clique em instalar. A instalação requer que você reinicie o WebStorm.

Agora você está pronto para usar a emulação Vim dentro do WebStorm.

Dicas úteis ao usar uma emulação Vim

Criar mapa de chaves – escolha o manipulador IDE ou Vim

Alguns plugins como o plugin IdeaVim permitem que você crie seu Keymap. Você pode decidir se deseja usar os atalhos do WebStorms ou os atalhos do Vim.

Para configurar o mapa de teclas na Webstorm, vá para Preferências> Vim Emulation

Aqui você pode escolher quais atalhos são usados.

Tecla personalizada para sair do modo de inserção

Sair do modo de inserção é essencial no Vim. É o propósito da tecla esc . Embora não haja nada errado ao usar a tecla esc há razões para considerar o mapeamento de uma chave de nossa escolha para essa funcionalidade.

  • Na minha opinião, a key esc está bem distante. Eu sempre preciso mover minha mão para acessar a tecla esc. Ao fazer isso, perco a posição inicial da mão no meu teclado.
  • Estou usando um novo MacBook Pro com uma barra de toque. A tecla esc da barra de toque não é uma chave física. É uma chave virtual. Acertar não parece natural e não dá feedback. Para mim, a barra de toque é, portanto, um critério matador quando uso o Vim sem uma chave personalizada para sair do modo de inserção.

O IdeaVim permite que você mapeie uma chave personalizada para a exit and insert funcionalidade exit and insert vá para Preferências, um tipo “insert de saída” no campo de busca.

Clique duas vezes em “ Sair do modo de inserção ”. Escolha “ Adicionar atalho de teclado ” e, em seguida, clique no seu traçado preferido para adicioná-lo como sua tecla “ Sair do modo de inserção ”.

Agora você pode sair do modo de inserção pressionando sua chave recém-adicionada.

Conclusão

Familiarizar-se com o Vim requer algum tempo e prática. Mas no final, é uma ferramenta única e fantástica que permite edição rápida como nenhum outro editor.

Quase todos os editores permitem que você emule o Vim de alguma forma. Considere adicionar um mapa de chaves personalizado ou uma chave personalizada para sair do modo de inserção.

Por último mas não menos importante; Desfrute de uma maneira única, rápida, sem rato e intuitiva de editar código. ?

? Por favor, dê algumas palmas clicando no botão clap below abaixo, se você gostou deste post.???

Os aplausos ajudam outras pessoas a encontrar e incentivam-me a escrever mais mensagens

Fique à vontade para conferir alguns dos meus outros artigos sobre o desenvolvimento do Front End.

Depure aplicativos angulares em produção sem revelar os mapas de origem
Abordagens alternativas para lidar com mapas de origem blog.angularindepth.com
Angular: repassa dados na mesma navegação de URL
Diferentes abordagens com seus prós e contras medium.com
Mergulho profundo herança de typescript ?
Como herança em Typescript realmente funciona por trás da cortina? hackernoon.com