Usando o Editor Config


Fala sério, não temos tempo nem pro café. Então bora parar de perder tempo formatando códigos.

Meus editores favoritos são VS Code e Rider. Pra essas IDEs existe um plugin maneiro chamado EditorConfig.

Esse plugin define o padrão de estilização e formatação para o projeto. Assim, ao salvar um arquivo, é aplicada a estilização.

Criando um arquivo .editorconfig, na raiz do projeto

# o arquivo na raiz é a referência única
# e principal para todo o projeto
root = true

# Regras gerais para todos os arquivos
[*]
# Codificação UTF-8
charset = utf-8
# Quebra de linha estilo Unix (LF)
end_of_line = lf
# Garante nova linha ao final do arquivo
insert_final_newline = true
# Usa espaços no lugar de tabulação
indent_style = space
# Tamanho da indentação: 2 espaços
indent_size = 2
# Remove espaços em branco no fim das linhas
trim_trailing_whitespace = true

# Regras específicas para arquivos Markdown
[*.md]
# Mantém espaços ao final
# (evita quebra em listas e blocos)
trim_trailing_whitespace = false

# Arquivos Astro
[*.astro]
# Indentação de 2 espaços
indent_size = 2
# Usa espaços
indent_style = space

# Arquivos JavaScript/TypeScript e variantes
[*.{js,ts,jsx,tsx}]
indent_size = 2
indent_style = space

# Arquivos de estilo (CSS, SCSS, etc.)
[*.{css,scss,sass,less}]
indent_size = 2
indent_style = space

Agora, pra funcionar, desabilite o salvamento automático na IDE. Ao salvar um novo arquivo, a formatação é executada, seguindo as novas regras definidas.

🧞 Desativar o salvamento automático é uma ótima opção, principalmente pra quem trabalha com testes.

EditorConfig - antes e depois

Show! Temos aqui uma excelente forma de manter a consistência de estilos no projeto, permitindo trabalho em equipe, com todos seguindo o mesmo padrão.

Esse recurso combina muito bem com o formatador de código, o Prettier. Mas esse assunto fica pra outro artigo e eu fico por aqui. 😄

Bons estudos e bons códigos!

Referências

EditorConfig - Consistência no estilo de código
Prettier - Código Elegante