Substituindo ESLint e Prettier pelo Biome: Uma Solução Completa para Linting e Formatação de Código

Felipe Vieira 30 de julho de 2024 🇧🇷 Português 2 min read

Substituindo ESLint e Prettier pelo Biome: Uma Solução Completa para Linting e Formatação de Código — cover

Nos meus novos projetos, tenho substituído o ESLint e Prettier pelo Biome.

Um dos grandes destaques do Biome é que ele já inclui muitas regras de plugins normalmente utilizados no ESLint, como typescript-eslint, eslint-plugin-react, eslint-plugin-react-hooks e muitos outros, removendo a necessidade de adicionar centenas de pacotes ao package.

Outro destaque é o seu linter, que retorna diagnósticos detalhados, fornecendo não apenas onde está o erro, mas também dicas de como você pode escrever aquele trecho utilizando métodos mais modernos e removendo código desnecessário quando possível.

Por ser um linter e formatter, Biome substitui a necessidade de utilizar duas ferramentas como acontece com ESLint e Prettier, centralizando tudo em apenas uma.

Como Instalar e Configurar o Biome

A instalação e configuração do Biome é super simples e tem integração com o VSCode.

Para instalar, basta adicionar o Biome ao seu projeto com o seguinte comando:

npm install biome --save-dev

Depois, crie um arquivo de configuração .biomerc na raiz do seu projeto com as regras desejadas. Por exemplo:


{
    "rules": {
        "no-unused-vars": "error",
        "prefer-const": "warn"
    }
}

Também é possível configurar o Biome para rodar automaticamente em cada commit usando o lint-staged com husky:


{
    "husky": {
        "hooks": {
            "pre-commit": "lint-staged"
        }
    },
    "lint-staged": {
        "*.js": [
            "biome fix",
            "git add"
        ]
    }
}

Integração com o VSCode

Para integrar o Biome no VSCode, instale a extensão Biome for Visual Studio Code a partir do marketplace. Com essa extensão, seu código será automaticamente formatado e analisado em tempo real durante a edição.

Conclusão

Você já conhecia o Biome? Já utilizou ele em seus projetos? A adoção dessa ferramenta pode simplificar a configuração e manutenção de códigos, além de fornecer diagnósticos mais precisos e dicas úteis para melhoria contínua do seu código.

Se você ainda não experimentou, vale a pena dar uma chance ao Biome e descobrir todos os benefícios que ele pode oferecer para seus projetos!

Para mais informações e detalhes sobre o Biome, visite o site oficial.