Aluizio Developer

17 de dezembro de 2020 • 1 min de leitura

Configuração do Editor Visual Studio Code

Iniciaremos configurando o Visual Studio Code com algumas extensões que serão bem úteis para o nosso processo de desenvolvimento.

Visual Studio Code

Página de download: Visual Studio Code

Fonte que eu gosto de usar para codar: Fira Code

Criar a pasta do novo projeto e abrir no VSCode:

mkdir api-vendas

code api-vendas/

Algumas extensões recomendadas para instalar no VSCode:

  • EditorConfig for VS Code.

  • ESLint – Integração do ESLint diretamente na IDE.

  • Prettier – Code Formatter – Integração do Prettier diretamente na IDE.

  • Docker – Para autocomplete, destaque de código e comandos do Docker.

  • Material Icon Theme – Esse não é necessário, mas eu gosto dos ícones bonitinhos e quis compartilhar.

  • Dracula Official

  • DotENV

Configuração recomendada para o VSCode:

{
  "workbench.colorTheme":"Dracula",

  "editor.fontSize":16,
  "editor.lineHeight":24,
  "editor.fontFamily":"Fira Code",
  "editor.fontLigatures":true,
  "editor.formatOnPaste": true,
  "editor.formatOnSave": true,
  "formattingToggle.affects": [
    "formatOnSave"
  ],
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },

  "editor.rulers": [
    80,
    120
  ],

  "editor.renderLineHighlight":"gutter",

  "terminal.integrated.fontSize":14,

  "workbench.iconTheme":"material-icon-theme",

  "material-icon-theme.activeIconPack": "nest",
  "material-icon-theme.folders.associations": {
    "entities": "class",
    "schemas": "class",
    "typeorm": "database",
    "repositories": "mappings",
    "http": "container",
    "migrations": "tools",
    "modules": "components",
    "implementations": "core",
    "websockets": "pipe"
  },

  "material-icon-theme.files.associations": {
    "ormconfig.json": "database",
    "tsconfig.json": "tune"
  },

  "emmet.syntaxProfiles": { "javascript": "jsx" },
  "emmet.includeLanguages": { "javascript": "javascriptreact" }
}

Comentários