Skip to content

Latest commit

 

History

History
242 lines (202 loc) · 7.39 KB

README.md

File metadata and controls

242 lines (202 loc) · 7.39 KB

Minhas configurações do VSCode

Aqui você encontrará minhas principais configurações do VSCode que uso em minha máquina. Minhas configurações estão sendo sempre atualizadas conforme meu gosto e necessidades, mas o que está aqui é todo conhecimento meu de configuração do VSCode acumulado de mais de 2 anos.

Usar estas configurações te trará a vantagem de já ter um ambiente de desenvolvimento no VSCode muito produtivo.

As configurações estão separadas nos seguintes tópicos:

Backup e sincronização das configurações do VSCode

No 1º semestre de 2022, O VSCode passou a permitir backup das suas configurações e sincronização com o servidor do GitHub. Siga as instruções do link https://code.visualstudio.com/docs/editor/settings-sync e ative isto, agora você nunca mais perderá suas configurações e ainda poderá sincroniza-las com outros computadores.

Tema

Github Theme - Estilo Github Dark.

Github Theme

Font-family

Usar uma fonte adequada para desenvolvimento melhorará seu conforto ao programar e ler código, escolha uma fonte adequada.

Eu uso a JetBrains Mono como fonte padrão.

Instale-a no seu computador e ativa-a no VSCode alterando a opção editor.fontFamily, exemplo:

"editor.fontFamily": "\"JetBrains Mono\", 'Courier New', monospace",

Esta propriedade permite outras fontes como fallback se as primeiras não existirem.

Shell default

Ter um shell que facilite a digitação de comandos é essencial para o desenvolvimento de software, eu uso o oh my zsh.

Ele guardará histórico dos comandos, facilitará auto-complete entre outras coisas.

Neste link eu mostro dicas de como instala-lo, além de configurações e ferramentas utilizado para Mac, Linux e Windows.

O oh my zsh permite configurar um tema de cores, eu uso o powerlevel10k. No link há instruções de como instala-lo e habilita-lo no oh my zsh. Instale também a fonte Meslo Nerd através do link: https://github.com/romkatv/powerlevel10k#meslo-nerd-font-patched-for-powerlevel10k.

Para Windows:

No Windows Terminal para a font Meslo Nerd funcionar no WSL, é necessário acessar Configurações -> Selecionar o Linux do lado esquerdo, clicar em Aparências em Configurações Adicionais e selecionar a fonte Meslo Nerd, como está na imagem:

Github Theme

Extensões

Minhas extensões podem ser facilmente instaladas no seu VSCode executando os seguintes comandos:

wget https://raw.githubusercontent.com/argentinaluiz/my-vscode-settings/main/vscode-settings/extensions.txt
wget -O - https://raw.githubusercontent.com/argentinaluiz/my-vscode-settings/main/install-extensions.sh | bash

Alguns settings relevantes

Modo de salvamento de arquivos

Ative-a clicando em File e depois em Auto Save no menu.

Extensões padrões no Remote Container

Se você usar o Remote Container para melhorar seu ambiente com o Docker, defina algumas extensões padrões que sempre estarão nos container.

Vá em Files -> Settings, pesquise por remote.containers.defaultExtensions e acrescente suas extensões padrões para containers.

As minhas são:

adpyke.codesnap
batisteo.vscode-django
bmewburn.vscode-intelephense-client
bradlc.vscode-tailwindcss
chakrounanas.turbo-console-log
christian-kohler.path-intellisense
cweijan.dbclient-jdbc
cweijan.vscode-redis-client
dbaeumer.vscode-eslint
donjayamanne.githistory
eamodio.gitlens
esbenp.prettier-vscode
firsttris.vscode-jest-runner
github.copilot
github.copilot-chat
github.vscode-github-actions
github.vscode-pull-request-github
golang.go
googlecloudtools.cloudcode
gruntfuggly.todo-tree
humao.rest-client
jebbs.plantuml
mblode.twig-language
mehedidracula.php-constructor
ms-azuretools.vscode-docker
ms-kubernetes-tools.vscode-kubernetes-tools
ms-python.debugpy
ms-python.isort
ms-python.python
ms-python.vscode-pylance
ms-vscode.live-server
ms-vscode.makefile-tools
ms-vscode.vscode-typescript-next
naumovs.color-highlight
oderwat.indent-rainbow
orta.vscode-jest
phproberto.vscode-php-getters-setters
prisma.prisma
quicktype.quicktype
redhat.vscode-yaml
robberphex.php-debug
sonarsource.sonarlint-vscode
sourcery.sourcery
streetsidesoftware.code-spell-checker
streetsidesoftware.code-spell-checker-portuguese-brazilian
tamasfe.even-better-toml
tim-koehler.helm-intellisense
visualstudioexptteam.intellicode-api-usage-examples
visualstudioexptteam.vscodeintellicode
vitest.explorer
vivaxy.vscode-conventional-commits
vue.volar
wallabyjs.quokka-vscode
xyz.local-history
yinfei.luahelper
zignd.html-css-class-completion
zobo.php-intellisense
zxh404.vscode-proto3

Extensão Peacock

Esta extensão permite colorir as bordas do VSCode, ajudando a identificar melhor vários VSCodes abertos. Você pode criar um esquema de cores por tecnologia e selecionar a cor para diferenciar os VSCodes abertos.

Abra o File -> Settings -> Peacock, e selecione o esquema de cores que desejar. Você pode editar o settings.json para adicionar mais cores facilmente, aqui estão as minhas:

"peacock.favoriteColors": [
    {
        "name": "Angular",
        "value": "#a6120d"
      },
      {
        "name": "Angular Red",
        "value": "#dd0531"
      },
      {
        "name": "Apache Kafka",
        "value": "#000000"
      },
      {
        "name": "Azure Blue",
        "value": "#007fff"
      },
      {
        "name": "Docker",
        "value": "#1d63ed"
      },
      {
        "name": "Django",
        "value": "#0C4B33"
      },
      {
        "name": "Golang",
        "value": "#007d9c"
      },
      {
        "name": "JavaScript Yellow",
        "value": "#f9e64f"
      },
      {
        "name": "Keycloak",
        "value": "#39a5dc"
      },
      {
        "name": "Kubernetes",
        "value": "#436ee3"
      },
      {
        "name": "Laravel",
        "value": "#fb503b"
      },
      {
        "name": "Loopback",
        "value": "#3f5dff"
      },
      {
        "name": "Mandalorian Blue",
        "value": "#1857a4"
      },
      {
        "name": "Nest.js",
        "value": "#e0234e"
      },
      {
        "name": "Node Green",
        "value": "#215732"
      },
      {
        "name": "Python",
        "value": "#25415d"
      },
      {
        "name": "React Blue",
        "value": "#61dafb"
      },
      {
        "name": "Something Different",
        "value": "#832561"
      },
      {
        "name": "Svelte Orange",
        "value": "#ff3d00"
      },
      {
        "name": "Vue Green",
        "value": "#42b883"
      },
      {
        "name": "RabbitMQ",
        "value": "#f60"
      },
      {
        "name": "TypeScript",
        "value": "#007acc"
      }
  ],

Selecionar qualquer texto no terminal ao selecionar com mouse

Ative a opção: "terminal.integrated.copyOnSelection": true