Ghid pentru utilizarea SublimeLinter pentru dezvoltatori

Linter este un instrument indispensabil în dezvoltarea web modernă. Aceasta ne ajută să rămânem la curent cu erorile și să aplicăm cele mai bune practici atunci când scriem coduri. Dacă utilizați SublimeText, vă recomand să instalați SublimeLinters. De-a lungul anilor, SublimeLinters sa dovedit a fi o suită de unelte electrice în SublimeText și a adus pachete oficiale care se conectează la linters de diferite limbi de programare.

În acest tutorial, vom vedea cum să instalați și să configurați SublimeLinter. Să începem.

Noțiuni de bază

Cea mai ușoară modalitate de a instala SublimeLinter 4 este prin controlul pachetului SublimeText. De când a intrat SublimeLinter 3, fiecare Linter trebuie instalat separat. Acest lucru permite ca SublimeLinter să ruleze mai eficient doar dacă rulează linters pe care le-am instalat.

Din moment ce folosesc HTML, CSS, JS și PHP de cele mai multe ori în proiectele mele, aș dori să instalez linters pentru aceste limbi. În Controlul pachetelor, Am instalat SublimeLinter împreună cu următoarele pluginuri:

• SublimeLinter-html-ordonată
• SublimeLinter-stylelint
• SublimeLinter-eslint
• SublimeLinter-php

Apoi, pentru ca aceste pluginuri să funcționeze, trebuie să instalăm și Linter pentru limbile care sunt HTML Tidy, CSSLint, JSHint și PHP CLI.

Pentru cei care folosiți OSX, Tidy și PHP sunt pre-instalate în sistem. Pentru a verifica, executați consecutiv următoarele două comenzi.

 ordonat --versiune php --versiune 

Aceste comenzi vă vor arăta versiunea Tidy și PHP pe care o aveți. Puteți să le folosiți în Text Sublim.

Dacă sunteți pe Windows sau Linux sau nu aveți instalate, puteți urma instrucțiunile de mai jos.

Instalarea programului HTML Tidy

Pentru a instala HTML Tidy:

• În OSX, executați această comandă în Terminal brew install homebrew / dupes / ordonat
• În Linux, utilizați această comandă sudo apt-get instalați ordonat.
• În Windows, puteți lua programul de instalare EXE din TidyBatchFiles.

Instalarea PHP CLI

• Utilizatorii OSX pot instala PHP în sistem cu curl-uri http://php-osx.liip.ch/install.sh | bash-s 5.5 comanda. Aceasta va instala PHP 5.5, cea mai recentă versiune, la momentul redactării.
• Linux utilizatorii pot urma acest tutorial cuprinzător de la DigitalOcean.
• Pentru utilizatorii Windows, puteți descărca programul de instalare aici.

Instalarea stilului

Apoi, vom instala linerul CSS numit Stylelint care ne va permite să verificăm și să aplicăm cele mai bune practici în fișierele noastre CSS. Următoarea instrucțiune poate fi urmată în toate cele trei platforme: OSX, Windows și Linux. Presupun că ați instalat deja Node.js cu NPM.

Pentru a instala Stylelint, executați:

 npm install -g stillint 

Rețineți că va trebui, de asemenea, să adăugați un fișier de configurare Stylelint în directorul dvs. de proiect, să instalați suplimentar o configurație predefinită, cum ar fi stillint-config-standard. Odată ce acestea sunt configurate, ar trebui să găsiți erorile evidențiate ca mai jos.

Instalarea ESLint

De asemenea, vom instala ESLint, un linter modern și extrem de configurabil pentru JavaScript. Acest lucru ne va ajuta să aplicăm cele mai bune practici, precum și să detectăm eventualele erori la scrierea codului JavaScript. Instalarea ESLint necesită, de asemenea, Node.js cu NPM.

Pentru ao instala, rulați.

 npm install -g eslint 

În mod similar, va trebui să adăugați configurația ESLint la proiectul dvs. sau să utilizați configurația predefinită, cum ar fi eslint-config-recommended.

Suntem cu toții pregătiți. Putem începe scămoșare HTML, CSS, JS și PHP în SublimeText folosind SublimeLinter 4.

Caracteristici noi în SublimeLinter 4

SublimeLinter 4 aduce câteva funcții noi, iar unul ușor de remarcat este panoul care afișează toate erorile fișierelor deschise. Dacă vă aflați pe Mac, apăsați Command + Ctrl + A. În Windows și Linux, puteți apăsa Ctrl + K, Ctrl + A.

Tasta Hot va afișa o listă de erori, după cum se arată în următoarea imagine de ecran.

Folosește ↑ și ↓ pentru a naviga în listă, iar pagina va defila la linia exactă în care a apărut eroarea.

Mai bine vizuale

Putem acum trece peste jgheab în editor sau doar pe linia unde apare eroarea pentru a vedea mesajul de eroare. Acest lucru nu a fost posibil în versiunea anterioară.

Foarte configurabil

SublimeLinter 4 este acum mai configurabil decât oricând. De exemplu, putem acum personalizat “stiluri” la fiecare configurație a linterului. Acest lucru ne permite să setăm separat pictogramele, culorile, modurile de scame, traseul și variabilele de mediu pentru fiecare linie.

Referințe ulterioare

Sper că această scurtă introducere ar putea ajuta la punerea în funcțiune cu SublimeLinter. De asemenea, puteți consulta referința dacă doriți mai multe lucruri avansate.

• SublimeLinter oficial Doc
• Lint în software și programare - WikiPedia
• Subpozitele de depozitare SublimeLinter