10 CSS un JavaScript Linting rīki kodu optimizācijai

Neapstrādes rīki var būtiski palīdzēt izstrādātājiem uzrakstiet labas kvalitātes, optimizētu kodu. Mīkstināšana ir koda pārbaudes process, kas meklē kļūdas avota kodā un atzīmē iespējamās kļūdas. Lielākā daļa latu izmanto statisko kodu analīzes metodi, kas nozīmē kods tiek pārbaudīts bez faktiskas izpildes.

Jūs varat uzlīmēt dažādos gadījumos, piemēram, reālā laikā, kad rakstāt kodu, kad saglabājat failu, kad veicat izmaiņas, vai pirms kods tiek ievadīts ražošanā. Neatkarīgi no jūsu darbplūsmas, ir svarīgi regulāri, tā kā tas nākotnē var glābt jūs no daudzām galvassāpēm.

Līstes nav tikai kļūdu novēršanas rīki, bet tos var efektīvi izmantot atkļūdošanas laikā atrast kļūdas, kas ir grūti uztveramas pretējā gadījumā. Šajā ziņojumā mēs pārbaudīsim 10 jaudīgus drukas rīkus, kurus var izmantot, lai savāktu CSS un JavaScript failus, lai uzlabotu jūsu koda kvalitāti.

1. CSSLint

Protams, CSSLint plāno "sāpēt savas jūtas", bet apmaiņā tas "padara jūs labāku kodu". CSSLint pašlaik vada CSS uzklāšanas tirgu. Tas ir rakstīts JavaScript, tas ir atvērtā koda, un tas ir aprīkots ar tonnām konfigurējamu opciju.

CSSLint ļauj jums izvēlēties, kādas kļūdas un brīdinājumi (saderība, veiktspēja, dublēšanās utt.) kuru vēlaties pārbaudīt, un apstiprina jūsu CSS sintaksi pret noteikumiem, kurus izvēlaties.

Tas nedarbojas tikai pārlūkprogrammā, bet tam ir arī komandrindas interfeiss, un jūs varat to integrēt arī savā būvniecības sistēmā.

2. SublimeLinter CSSLint

CSSLint ir tik efektīvs CSS linteris, ka ir grūti atrast konkurentu, kas līdz tam veic pasākumus. Iespējams, ka tas ir iemesls, kāpēc SublimeLinter savārstniecības sistēma uz tā ir izveidojusi savu CSS uzklāšanas spraudni. SublimeLinter ir SublimeText spraudnis nodrošina lietotājiem iespēju kodēt savu kodu (CSS, PHP, Python, Java, Ruby utt.) tieši SublimeText editor.

Pirms paša SublimeLinter CSSLint spraudņa instalēšanas, jums ir nepieciešams instalēt CSSLint kā Node.js moduli. Lieliska lieta par šo ērto rīku ir tā, ka jūs tikai vienreiz jākonfigurē iestatījumi, vai, ja esat apmierināts ar noklusējumiem, jums pat nav jādara tas, tad jūs vienmēr varat saņemt attiecīgos brīdinājumus un paziņojumus SublimeText redaktorā bez jebkādām papildu problēmām.

3. StyleLint

StyleLint palīdz izstrādātājiem izvairīties no kļūdām CSS, SCSS vai citās sintaksēs, ko PostCSS var analizēt. StyleLint pārbauda vairāk nekā simts noteikumu, un jūs varat izvēlēties, kuras no tām vēlaties ieslēgt (skatiet piemēru konfigurāciju).

Ja nevēlaties veidot savu konfigurāciju, varat izvēlēties arī iepriekš rakstītu standarta konfigurāciju, kas satur aptuveni 60 StyleLint noteikumus. StyleLint ir diezgan elastīgs rīks, to var paplašināt ar papildu spraudņiem un izmantot 3 dažādās formās: kā komandrindas rīku, kā Node.js moduli, vai kā PostCSS spraudni.

4. W3C CSS validators

Lai gan W3C CSS Validator parasti netiek uzskatīts par šķiedru rīku, tas sniedz izstrādātājiem lielisku iespēju pārbaudīt savu CSS pirmkodu pret W3C oficiālajiem standartiem. W3C izveidoja savus validatorus ar nolūku nodrošināt rīku, kas ir līdzīgs C valodai paredzētā Lint programmas pārbaudītājam.

Sākumā viņi izveidoja HTML iezīmēšanas validatoru, kam vēlāk sekoja CSS validators. W3C CSS validatoram nav tik daudz iespēju kā CSSLint, bet tas ir atgriež detalizētus, viegli saprotamus kļūdu ziņojumus un paziņojumus.

Kā papildu funkciju jūs varat arī pārbaudīt savu kodu, salīdzinot ar W3C nesenajiem mobilajiem tīmekļa standartiem, kas mobilā interneta laikmetā nav slikti..

5. Netīrs marķējums

Netīrs marķējums attīra, formatē un apstiprina jūsu HTML, CSS un JavaScript kodu. Tas var būt lieliska izvēle, ja vēlaties vienkāršu dizainu un vēlaties ātru risinājumu. Netīrs marķējums izsaka kļūdas ziņojumus un paziņojumus reālā laikā kamēr jūs rakstiet vai modificējiet savu kodu redaktorā.

Kad jūs hit “Tīrs” poga, tā nosaka sintakses kļūdas uzreiz, sakārto formātu, bet brīdinājumus atstāj neskartus ļaujot jums tos atrisināt, taču vēlaties. Jūs nevarat izvēlēties, kurus noteikumus vēlaties pārbaudīt, bet visus trīs failu tipus ir daži iestatījumi, kas ļauj izvēlēties formātu iztīrīto izeju.

6. JSLint

JSLint pirmo reizi izlaida 2002. gadā Douglas Crockford, un kopš tā laika tas nav zaudējis spēku, tāpēc jūs varat droši pieņemt, ka tas ir stabils un uzticams JavaScript rīku veidošanas rīks.

JSLint var apstrādāt JavaScript pirmkodu un JSON tekstu, un tas nāk ar gatavu konfigurāciju, kas atbilst JS paraugpraksei Crockford rakstīja savā grāmatā ar nosaukumu JavaScript: Labās daļas.

JSLint ir dažas iespējas, no kurām jūs varat izvēlēties, bet jūs nevar pievienot savus pielāgotos noteikumus vai atspējot lielāko daļu funkciju. JSLint jau ir sācis iekļaut jaunākos ECMAScript 6 standartus, jūs varat iepazīties ar pašreizējo ES6 īstenošanas posmu šeit.

7. JSHint

JSHint ir ļoti populārs JSLint dakša, un to izmanto lielākie tehnoloģiju uzņēmumi, piemēram, Facebook, Twitter un Medium

JSHint ir kopienas virzīts projekts, kas sākās ar centieniem izveidojiet konfigurējamu un mazāk izteiktu JSLint versiju. JSHint ļauj izstrādātājiem konfigurēt jebkuru no savām iespiedumu opcijām un ievietot pielāgoto konfigurāciju atsevišķā failā, kas padara rīku viegli izmantojamu atkārtoti un ir piemērots lielākiem projektiem.

Jūs ne tikai varat izmantot JSHint, lai novirzītu vaniļas JavaScript, bet arī ir pieejams atbalsts daudzām populārām JS bibliotēkām, piemēram, jQuery, Mootools, Mocha un Node.js.

8. ESLint

ESLint ir jaunākā lielā lieta JavaScript linting ainavā. Tās popularitāte izriet no tā ļoti elastīgā rakstura. Jūs varēsiet ne tikai pielāgot daudzus sarežģītus savākšanas noteikumus, bet arī integrēt tos ar visiem galvenajiem kodu redaktoriem, bet jūs varat arī viegli paplašināt tās funkcijas pievienojot dažādus spraudņus.

Norādot parsētāja iespējas, varat arī izvēlēties JS valodas standartu, kuru vēlaties atbalstīt pīlinga procesā, kas nozīmē, ka jūs ne tikai varat pārbaudīt skriptus pret noklusēto ECMAScript 5 sintaksi, bet arī pret ECMAScript 6, ECMAScript 7 un JSX.

9. JSCS

JSCS vai JavaScript koda stils ir pievienojams koda stils linter JavaScript, kas pārbauda kodu formatēšanas noteikumus.

ASCS mērķis ir nodrošināt līdzekļus Programmatiski īstenot noteiktu kodēšanas stila rokasgrāmatu. Kaut arī JSCS nepārbauda kļūdas un kļūdas, to joprojām izmanto daudzi galvenie tehnoloģiju nozares dalībnieki, piemēram, Google, AirBnB un AngularJS, jo tas palīdz izstrādātājiem saglabāt ļoti lasāmu, konsekventu koda bāzi.

JSCS ir reāls laika taupītājs, jo tas automātiski nosaka jūsu formatēšanas kļūdas, tāpēc jums nav jādodas caur tiem pa vienam. Tajā ir daudz dažādu iestatījumu, kas pieder lielākiem projektiem, piemēram, Google, Grunt vai Wikimedia kodēšanas stila iestatījumiem, kurus varat viegli izmantot savos projektos, bet varat izveidot arī savu pielāgoto konfigurāciju.

10. StandardJS

StandardJS vai JavaScript standarta stils ir koda stils, tāpat kā JSCS, bet atšķiras no vienkāršības un vienkāršības. StandardJS var būt lieliska izvēle, ja nevēlaties pavadīt laiku ar konfigurāciju, vienkārši vēlaties efektīvu rīku, kas iziet no kastes.

StandardJS seko nedaudziem iepriekš uzrakstītiem formatēšanas noteikumiem, un tās pamatvērtība ir saglabāt jūsu kodēšanas darbplūsmu bez traucējumiem, tāpēc jūs nevarat mainīt noteikumus, ar kuriem nepiekrītat. Izvēlēties tikai StandardJS, ja nevēlaties, lai būtu pielāgota konfigurācija un tikai vēlaties konsekventa koda stila ievērošana jūsu JavaScript failos.