Introdução

O ESLint é uma ferramenta de análise de código estática para identificar padrões problemáticos encontrados no código JavaScript. Ele é altamente configurável e pode ser usado para manter um estilo de código consistente em um projeto.

No nosso ecossistema de desenvolvimento, o ESLint é uma ferramenta essencial para garantir a qualidade do código e evitar erros comuns.

O que é?

ESLint é uma ferramenta de análise estática de código projetada para JavaScript e TypeScript. Ele examina seu código em busca de erros de sintaxe, inconsistências de formatação e possíveis bugs, com base em um conjunto de regras predefinidas ou personalizadas. Ao integrar o ESLint ao seu fluxo de trabalho, você pode:

• Identificar e corrigir problemas de código antes de executar o aplicativo.
• Manter um estilo de código consistente em todo o projeto.
• Melhorar a manutenibilidade e legibilidade do código.
• Evitar erros comuns e práticas inseguras.

Instalação

No nosso projeto, o ESLint já está configurado e pronto para uso. Para instalar o ESLint em um novo projeto, você pode executar o seguinte comando:

npm install eslint --save-dev

Depois de instalar o ESLint, você pode inicializar um arquivo de configuração usando o comando:

npx eslint --init

Este comando irá guiá-lo através de um assistente de configuração para criar um arquivo de configuração personalizado para o seu projeto.

Configuração

O ESLint é altamente configurável, permitindo personalizar seu comportamento conforme as necessidades do seu projeto. A configuração geralmente é armazenada em um arquivo chamado .eslintrc.js, .eslintrc.json ou .eslintrc.yaml; no nosso caso, em eslint.config.mjs, um arquivo de modulo de Javascript. As configurações no nosso projeto são as seguintes:

1

A maioria das configurações são importadas de pacotes de regras predefinidas, next/core-web-vitals e next/typescript. Você também pode adicionar regras personalizadas ao arquivo de configuração para atender às necessidades específicas do seu projeto.

Aprenda mais sobre as configurações disponíveis no guia de configuração do ESLint.

Uso

O ESLint está configurado, com ajuda do Husky, para ser executado automaticamente antes de cada commit. Isso garante que o código esteja em conformidade com as regras de estilo definidas no arquivo de configuração. O seu commit não será concluído se o ESLint encontrar problemas no código.

Para executar o ESLint em seu projeto, você pode usar o comando:

npm run lint

O comando acima foi configurado no package.json para executar o ESLint em todos os arquivos JavaScript e TypeScript do projeto. Ele irá analisar o código em busca de problemas e exibir os resultados no terminal.

Não recomendado - para corrigir automaticamente os problemas identificados pelo ESLint, você pode executar o comando:

npx eslint . --fix