Olá, pessoal!
Recentemente estava instalando meus programas no mac depois que ele voltou do conserto e ao instalar as extensões do VSCode e sempre aparece alguém perguntando quais extensões eu uso e hoje resolvi fazer um post pra deixar claro pra vocês quais uso atualmente (Janeiro/2020).
ESLint
ESLint by Dirk Baeumer
ESLint do Dirk Baeumer é uma exetensão que irá checar se o seu código está escrito de acordo com as regras do seu arquivo .eslintrc.
Com esse plugin você irá ser “lembrado” de escrever um código seguindo os padrões definido por você ou seu time. Um bom estilo de código a se seguir em projetos JavaScript é o coding style do AirBnB.
Lembrando que você precisa ter a biblioteca eslint em seu projeto ou de forma global em sua máguina
Prettier – Code formatter
Prettier – Code formatter
Prettier do Esben Petersen como o próprio nome ja diz é uma extensão que formata seu código. Bem similar ao ESLint ele também define como seu código será formatado e também formata o código pra você (quando o Format on Save tá habilitado). Para isso você precisa configurar o .prettierrc e ter biblioteca “prettier” instalada.
GitLens
GitLens
GitLens do Eric Amodio é uma outra biblioteca que eu acho essencial quando se trabalha em equipe, pois ela mostra em qual commit cada linha foi alterada. É uma espécie de gitblame disponível em seu código em tempo real.
Import Cost
Import Cost
Import Cost do Wix é uma outra que eu acho muito interessante, pois quando você faz um import ou require ele te mostra o tamanho da biblioteca que você está importando e caso ela seja muito grande irá aparecer em vermelho, te lembrando que é uma biblioteca que pode pesar o seu bundle.
Live Server
Live Server
Live Server do Ritwick Dey é uma mão na roda. Vamos supor que você esteja testando alguma coisa rapidinha em html/css/js estático e não quer criar um server pra ver o projeto rodando, o LiveServer cria um server pra você e traz de bonus um “live reload” que recarrega a página automaticamente quando você altera/salva o arquivo.
Bonus
Gostaria de falar também sobre algumas outras extensões que eu uso.
Filesize mostra o tamanho do arquivo atual
styled-components
styled-components deixa a syntax dos styled components de forma mais legível.
vscode-icons
vscode-icons coloca ícones nos arquivos de acordo com os seus tipos, facilitando a visualização.
Obrigado pela leitura, compartilhe!
Se você gostou desse post, compartilhe com seus amigos, ajude a espalhar conhecimento!
Não se esqueça de nos seguir nas redes sociais, por que você não pode ficar de fora!
- Faça parte da nossa lista de Desenvolvedores ?
- Se inscreva em nosso canal do Youtube ?
- Curta nossa página no Facebook ?
- Não perca as atualizações no Twitter ?
- Veja as dicas no Instagram ?
- Siga nossos repositórios no Github ⌨️
0 Comments