Uma outra ferramenta que nos auxilia no momento de padronizarmos o nosso projeto, e talvez seja a mais importante, é o Eslint. Com ele conseguimos automatizar os padrões de códigos do nosso projeto, e podemos utiliza-lo para projetos em NodeJS, ReactJS e React Native.
Por exemplo, no Javascript o uso do ponto e vírgula ao final de uma linha é facultativo, ou seja, diferente de algumas linguagens, a falta dele não interfere para que o código seja compilado. Outra utilização que também é opcional é o uso de aspas duplas ou aspas simples.
Já quando estamos criando um objeto, o uso da vírgula no último item do objeto também é opcional, como podemos ver no exemplo abaixo.
const aluno = {
nome: "Mariana",
idade: 20,
};
const aluno = {
nome: "Daniel",
idade: 21
};
No primeiro objeto utilizamos vírgula após o valor dentro do atributo idade, já no segundo não utilizamos, o que não interfere na execução do código.
O Eslint integra, não somente para o VSCode, mas também com qualquer outro tipo de editor, o que mais uma vez ajuda na padronização do código, caso um outro desenvolvedor esteja desenvolvendo no mesmo projeto, mas não queira usar o VSCode.
Antes de iniciar de fato a configuração do Eslint em nosso projeto, precisamos instalar a extensão do Eslint no VSCode. É ela quem irá nos auxiliar para que nossas configurações sejam entendidas dentro do nosso código.
ESLint - Visual Studio Marketplace
Uma outra configuração que é geral e precisamos fazer para o VSCode formatar o código sempre que salvarmos algum arquivo é adicionar uma opção chamada codeActionsOnSave
nas configurações, assim como mostrado abaixo:
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
}
Pra começar, vamos instalar o Eslint como uma dependência de desenvolvimento dentro do nosso projeto NodeJS.
yarn add eslint -D
Após a instalação, precisamos inicializar o eslint pra conseguirmos inserir as configurações dentro do projeto.
Faremos isso inserindo o seguinte código no terminal: