Linting JavaScript con JSHint

linting nella programmazione del computer è il processo di codice di analisi statico per trovare problemi come sintassi errata e uso incerto del codice. Lo strumento utilizzato per lo sfilacciamento è noto come a garza o linter. Uno dei ltri disponibili per JavaScript oggi è JSHint.

JSHint è disponibile per più piattaforme. Lo strumento online che molti di noi conoscono è su jshint.com. Ci sono anche i strumento da riga di comando tramite Node.js, un API JavaScript, più editor di testo e plugin IDE per JSHint. È possibile visualizzare l'elenco completo degli strumenti JSHint disponibili per diversi ambienti nella pagina di download e installazione del sito Web JSHint.

Secondo il suo sito web, i due modi più comuni in cui viene utilizzato lo strumento JSHint sono i seguenti strumento da riga di comando e il API. Diamo un'occhiata a come è possibile scaricare entrambi, insieme ad altri accessori per lo smalto che gli strumenti forniscono.

Tramite lo strumento della riga di comando

(1) Se non hai installato Node.js sul tuo computer, dovrai prima andare sul suo sito Web e scaricarlo e installarlo. Per verificare se Node.js è stato installato correttamente, puoi eseguire il comando npm -version nell'interfaccia della riga di comando (CLI) e ti mostrerà la versione di Node.js nel tuo computer (oppure puoi semplicemente eseguire il comando npm e vedi cosa succede).

(2) Per installare lo strumento JSHint, eseguire il comando npm installa jshint in CLI. Se si desidera verificare se JSHint è stato installato correttamente, eseguire il comando jshint -version per vedere la sua versione. Una volta che questo passaggio è finito, l'installazione è completa.

(3) Per eseguire lo strumento, vai alla directory nella CLI in cui il tuo file JavaScript (per esempio test.js) è ed esegue il comando jshint test.js. Apparirà il risultato dell'analisi dello strumento sul tuo codice JavaScript (qualcosa di simile a questo):

Tramite l'API JavaScript

(1) Scarica il file compresso da questo link GitHub e decomprimilo. Nel dist cartella troverai il jshint File JS (la libreria API).

(2) Per utilizzare l'API, aggiungi il jshint JS file per il tuo progetto e collegarlo alla tua pagina. È possibile accedere all'API nel codice JavaScript utilizzando la funzione / oggetto chiamato JSHINT. Di seguito è riportato un codice HTML di esempio in cui viene utilizzata l'API JavaScript di JSHint per analizzare il codice JavaScript presente nel file fonte array e visualizza i risultati dell'analisi sulla pagina.

(3) Abbiamo passato il fonte array contenente il codice sorgente JavaScript da analizzare e opzioni oggetto contenente opzioni di linting (entreremo in opzioni a breve) come parametri per JSHINT funzione. Da qui viene prelevato il risultato dell'analisi (un oggetto JSON) JSHINTla proprietà della funzione chiamata dati.

(4) JSON.stringify viene utilizzato solo per la visualizzazione, per visualizzare il risultato restituito da dati funzione in formato stringa sulla pagina. Il abbellito La stringa JSON ha questo aspetto. Le parti evidenziate sono gli errori trovati da JSHint in frasi semplici.

Opzioni di lanugine

Le opzioni di linting consentono di configurare il processo di sfilacciamento. Possiamo specificare quale tipo di errori o wanring devono essere linted e quali no. Nell'esempio precedente sono state utilizzate due opzioni di sfilacciamento undef e non usato.

undef l'opzione segnala le variabili non dichiarate e non usato indicherà le variabili dichiarate ma mai utilizzate. Come questi ci sono molte più opzioni che puoi vedere in questa pagina, se vuoi cercare un'opzione, c'è una barra di ricerca nell'angolo in alto a destra.

Se si utilizza lo strumento CLI tramite Node.js, è possibile scrivere le opzioni di sfilacciamento all'interno di a package.json file sotto la proprietà jshintConfig nella stessa directory. Puoi anche aggiungere le opzioni come direttive nel codice JavaScript.

 // - test.js - / * jshint undef: true, unused: true * / foo (); a = 7;

Esistono altri modi per configurare le opzioni di linting nel tuo progetto in base allo strumento che stai utilizzando. Scopri i diversi modi per configurazione Qui.