Linting JavaScript med JSHint
linting i computerprogrammering er processen med statisk analyse kode for at finde emner som forkert syntaks, og iffy brug af kode. Værktøjet til linting er kendt som a fnug eller linter. En af de linters til rådighed for JavaScript i dag er JSHint.
JSHint er tilgængelig til flere platforme. Det online webværktøj, som de fleste af os er bekendt med, er på jshint.com. Der er også den kommandolinjeværktøj via Node.js, -en JavaScript API, flere tekstredigerere og IDE-plugins for JSHint. Du kan se den fulde liste over tilgængelige JSHint-værktøjer til forskellige miljøer på download- og installationssiden på JSHint-webstedet.
Ifølge dets hjemmeside er de to mest almindelige måder, som JSHint-værktøjet bruges til, som kommandolinjeværktøj og API. Lad os tage et kig på, hvordan du kan downloade brug begge sammen med andre lintingoptioner, som værktøjerne giver.
Via kommandolinjeværktøj
(1) Hvis du ikke har Node.js installeret på din computer, skal du gå på sin hjemmeside og downloade og installere den først. For at kontrollere, om Node.js er installeret, kan du køre kommandoen npm-version
i kommandolinjegrænsefladen (CLI), og det viser dig versionen af Node.js på din computer (eller du kan bare køre kommandoen NPM
og se hvad der sker).
(2) For at installere JSHint-værktøjet skal du køre kommandoen npm installere jshint
i CLI. Hvis du vil kontrollere, om JSHint er installeret, skal du køre kommandoen jshint-version
for at se sin version. Når dette trin er slut, er installationen afsluttet.
(3) For at køre værktøjet skal du gå til biblioteket i CLI, hvor din JavaScript-fil (f.eks test.js) er og køre kommandoen jshint test.js
. Resultatet af værktøjets analyse på din JavaScript-kode vises (noget som dette):
Via JavaScript API
(1) Download den komprimerede fil fra dette GitHub link, og pak det ud. I dist mappe finder du jshint JS-fil (API-biblioteket).
(2) For at bruge API'en skal du tilføje jshint JS-fil til dit projekt og link det til din side. API'en kan fås i JavaScript-koden ved hjælp af den kaldte funktion / objekt JSHINT
. Nedenfor er en sample HTML kode, hvor JSHint's JavaScript API bruges til at analysere JavaScript-koden til stede i kilde
array og vise analyseresultaterne på siden.
Dokument
(3) Vi gik forbi kilde
array indeholdende JavaScript kildekoden, der skal analyseres og muligheder
objekt indeholdende linting muligheder (vi vil gå ind muligheder kort tid) som parametre til JSHINT
fungere. Analyseresultatet (et JSON-objekt) hentes fra JSHINT
funktionsegenskab kaldet data
.
(4) JSON.stringify
bruges kun til visning her, for at vise resultatet returneret fra data
funktion i strengformat på siden. Det forskønnede JSON-streng ser sådan ud. De fremhævede dele er de fejl, der er fundet af JSHint formuleret i enkle sætninger.
Linting Options
Linting muligheder giver os mulighed for at konfigurere linting processen. Vi kan angive, hvilken type fejl eller forringelse der skal være linted, og hvilke gør det ikke. I det foregående eksempel blev der brugt to linting-muligheder, nemlig undef
og ubrugt
.
undef
option flagrer ikke-angivne variabler, og ubrugt
vil markere variabler, der blev erklæret, men aldrig brugt. Ligesom disse er der mange flere muligheder, som du kan se en liste over på denne side, hvis du vil søge efter en indstilling, findes der en søgefelt i øverste højre hjørne.
Hvis du bruger CLI-værktøjet via Node.js, kan du skrive linting mulighederne i a package.json
fil under ejendommen jshintConfig
i samme mappe. Du kan også tilføje valgmulighederne som direktiver i JavaScript-koden.
// - test.js - / * jshint undef: true, ubrugt: true * / foo (); a = 7;
Der er flere måder at konfigurere linting muligheder i dit projekt baseret på det værktøj, du bruger. Tjek de forskellige måder for konfiguration her.