Linting JavaScript com JSHint

Linting na programação de computadores é o processo de código de análise estática para encontrar problemas como sintaxe incorreta e uso indevido de código. A ferramenta usada para linting é conhecida como fiapos ou linter. Um dos linters disponíveis para JavaScript hoje é o JSHint.

O JSHint está disponível para várias plataformas. A ferramenta da Web on-line com a qual a maioria de nós está familiarizada está em jshint.com. Há também o ferramenta de linha de comando via Node.js, uma API JavaScript, vários editores de texto e plugins IDE para JSHint. Você pode ver a lista completa de ferramentas JSHint disponíveis para diferentes ambientes na página de download e instalação do site do JSHint.

De acordo com seu site, as duas formas mais comuns usadas pela ferramenta JSHint são: ferramenta de linha de comando e a API. Vamos dar uma olhada em como você pode baixar usar ambos, juntamente com outras optiosn linting as ferramentas fornecem.

Via ferramenta de linha de comando

(1) Se você ainda não tem o Node.js instalado no seu computador, então você terá que ir ao seu site e baixá-lo e instalá-lo primeiro. Para verificar se o Node.js foi instalado com sucesso, você pode executar o comando npm -version na interface de linha de comando (CLI) e ele mostrará a versão do Node.js em seu computador (ou você pode simplesmente executar o comando npm e veja o que acontece.

(2) Para instalar a ferramenta JSHint, execute o comando npm instalar jshint no CLI. Se você quiser verificar se o JSHint foi instalado com sucesso, execute o comando jshint -version para ver sua versão. Quando esta etapa terminar, a instalação estará concluída.

(3) Para executar a ferramenta, vá para o diretório no CLI onde seu arquivo JavaScript (digamos test.js) é e executa o comando jshint test.js. O resultado da análise da ferramenta no seu código JavaScript aparecerá (algo como isto):

Via a API JavaScript

(1) Baixe o arquivo compactado deste link do GitHub e descompacte-o. No dist pasta você encontrará o jshint Arquivo JS (a biblioteca da API).

(2) Para usar a API, adicione o jshint Arquivo JS para o seu projeto e vinculá-lo à sua página. A API pode ser acessada no código JavaScript usando a função / objeto chamado JSHINT. Abaixo está um exemplo de código HTML onde a API JavaScript do JSHint é usada para analisar o código JavaScript presente no fonte matriz e exibir os resultados da análise na página.

(3) Nós passamos o fonte array contendo o código-fonte JavaScript a ser analisado e opções objeto contendo opções de lintagem (vamos entrar em opções em breve) como parâmetros para o JSHINT função. O resultado da análise (um objeto JSON) é obtido de JSHINTpropriedade da função chamada dados.

(4) JSON.stringify é usado para exibir somente aqui, para exibir o resultado retornado do dados função em formato de string na página. o embelezado A string JSON é semelhante a essa. As partes destacadas são os erros encontrados pelo JSHint redigidos em sentenças simples.

Opções de Lintagem

Opções de lixa nos permitem configurar o processo de lintagem. Podemos especificar quais tipos de erros ou wanring precisam ser lintados e quais não precisam. No exemplo anterior, foram usadas duas opções de lintagem, undef e sem uso.

undef opção sinaliza variáveis ​​não declaradas e sem uso irá marcar variáveis ​​que foram declaradas mas nunca usadas. Como esses, existem muitas outras opções que você pode ver nesta lista, se você quiser pesquisar uma opção, há uma barra de pesquisa no canto superior direito.

Se você estiver usando a ferramenta CLI via Node.js, você pode escrever as opções de linting dentro de um package.json arquivo sob a propriedade jshintConfig no mesmo diretório. Você também pode adicionar as opções como diretivas no código JavaScript.

 // - test.js - / * jshint undef: true, não utilizado: true * / foo (); a = 7;

Há mais maneiras de configurar as opções de linting no seu projeto com base na ferramenta que você está usando. Confira as diferentes maneiras de configuração Aqui.