Prefácio
O JSHINT é usado para analisar e verificar se o código JavaScript está em conformidade com suas regras de codificação. Essa ferramenta poderosa pode ajudar a identificar erros e problemas em seu código, e força sua equipe a manter certas convenções e estilos de codificação, tornando o código confiável e mais fácil de ler.
Neste artigo, mostrarei como instalar, configurar e usar o jshint. Também está incluído um exemplo listando alguns dos meus editores favoritos que podem usar o JSHINT.
Instale Jshint
A instalação do JSHINT é muito fácil, você pode usar o Node Package Manager (NPM). Se você ainda não instalou o NPM, pode baixar a versão mais recente do site do NodeJS para instalar o Node.js e o NPM.
Depois que o NPM estiver instalado, você pode usar o seguinte comando para instalar o jshint:
npm install jshint -g
O parâmetro -g diz npm que queremos instalar globalmente para que possamos chamar esse comando em qualquer diretório.
Verifique o código através da linha de comando
Agora que o JSHINT está instalado, vamos usar jshint na linha de comando para analisar um arquivo de código JavaScript.
Aqui está um arquivo com o nome do arquivo Demo1.json:
Usamos o seguinte comando para analisar o código:
JSHINT Demo1.js
O JSHINT nos diz que há um erro na linha 8 do arquivo Demo1.js, o motivo: um ponto de vírgula está faltando.
Se preenchermos o semicolon ausente e executarmos este comando novamente, não haverá saída de mensagem de erro.
Configure jshint
O JSHINT possui uma configuração padrão para analisar seu código, mas suas definições de configuração são projetadas para serem muito flexíveis. Existem quatro maneiras de fornecer arquivos de processamento de configuração para JSHint.
Uma maneira é usar o parâmetro --config para especificar o arquivo de configuração:
jshint Demo1.js -Config config.json
Outra maneira é colocar a configuração em um arquivo chamado .jshintc, porque o JSHINT procurará esse arquivo de configuração no mesmo diretório de nível para análise de código. Se não for encontrado, continuará pesquisando o diretório superior até o diretório raiz, o que nos permite definir diferentes arquivos de configuração para um projeto.
O terceiro método é colocar informações de configuração na propriedade jshintconfig do arquivo package.json.
Em qualquer um desses três métodos, as informações de configuração são o formato JSON para especificar cada parâmetro para informar ou desativar a opção jshint. Por exemplo: "não utilizado" e "undef" no arquivo de configuração a seguir, é ativar alarmes para variáveis não utilizadas e indefinidas. "Curly" exige que você sempre coloque aparelhos em loops e blocos condicionais. "Eqeqeq" significa que == e! = são proibidos, mas devem ser usados === e! ==. "Globals" é usado para especificar uma lista de permissões de variáveis globais que não são definidas no código.
O quarto método é escrever informações de configuração no arquivo de código na anotação.
Você pode visualizar diferentes opções de configuração para controlar o comportamento do JSHint.
Um pequeno exemplo
Em seguida, vamos operar as opções no arquivo de configuração Config.json mencionado acima. Suponha que tenhamos um arquivo JavaScript abaixo, que é apenas um pequeno pedaço de código apenas para aprender.
Se executarmos a demonstração do comando demo2.js --config config.json , obteremos o seguinte resultado:
Existem 4 erros em nosso código. Na linha 9, o JSHint solicita que o bloco de código "se" deve ser embrulhado em aparelhos. A variável subscription_id é definida, mas não usada. Nas linhas 9 e 11, "confirmar" e "console" não são definidas.
Podemos evitar os dois primeiros erros com apenas um pouco de modificação:
Agora, vamos adicionar uma opção de desenvolvimento no arquivo config.json e defini -lo como true para que o jshint possa reconhecer "confirmar" e "console".
Neste ponto, se executarmos o comando jshint novamente, não haverá erros.
Resumir
O JSHINT é uma ferramenta muito boa para reduzir os erros de código. Muitos editores fornecem suporte ao JSHint. Amigos que estão interessados podem estudar ainda mais o JSHint. O exposto acima é sobre o uso do JSHint para reduzir os erros de JavaScript. Espero que seja útil para todos que usam JavaScript.