Guide til bruk av SublimeLinter for utviklere

Linter er et uunnværlig verktøy i moderne webutvikling. Det hjelper oss å holde kontakten med feil og håndheve beste praksis når du skriver koder. Hvis du bruker SublimeText, anbefaler jeg at du installerer SublimeLinters. Gjennom årene har SublimeLinters utviklet seg til å være en kraftverktøyssuite i SublimeText og brakt offisielle pakker som kobler seg til linjer i ulike programmeringsspråk.

I denne veiledningen ser vi hvordan du installerer og installerer SublimeLinter. La oss bare komme i gang.

Starter

Den enkleste måten å installere SublimeLinter 4 på er via SublimeText Package Control. Helt siden i SublimeLinter 3, Hver linter må installeres separat. Dette gjør at SublimeLinter kan kjøre mer effektivt ved bare å kjøre linters som vi har installert.

Siden jeg bruker HTML, CSS, JS og PHP mesteparten av tiden i prosjektene mine, vil jeg gjerne installere linjer for disse språkene. I Pakkekontroll, Jeg installerer SublimeLinter sammen med følgende plugins:

• SublimeLinter-html-ryddig
• SublimeLinter-stylelint
• SublimeLinter-eslint
• SublimeLinter-php

Da, for at disse pluginene skal fungere, må vi også installere linter for språkene, som er HTML Tidy, CSSLint, JSHint og PHP CLI.

For de av dere som bruker OSX, er Tidy og PHP forhåndsinstallert i systemet. For å bekrefte, kjør følgende to kommandoer i rekkefølge.

 ryddig --versjon php - versjon 

Disse kommandoene vil vise deg Tidy og PHP versjonen du har. Du kan fortsette å bruke dem i Sublime Text.

Hvis du er på Windows eller Linux, eller ikke har dem installert, kan du følge instruksjonene nedenfor.

Installere HTML Tidy

Slik installerer du HTML Tidy:

• I OSX, Kjør denne kommandoen i Terminal brew installere homebrew / dupes / ryddig
• I Linux, bruk denne kommandoen sudo apt-få installert ryddig.
• I Windows, Du kan ta tak i EXE-installatøren fra TidyBatchFiles.

Installere PHP CLI

• OSX-brukere kan installere PHP i systemet med curl -s http://php-osx.liip.ch/install.sh | bash-s 5.5 kommando. Dette vil installere PHP 5.5, som er den nyeste versjonen, på tidspunktet for skrivingen.
• Linux Brukerne kan følge denne omfattende opplæringen fra DigitalOcean.
• For Windows-brukere, Du kan laste ned installasjonsprogrammet her.

Installere Styleint

Deretter skal vi installere CSS-linteren som heter Stylelint, som gjør at vi kan sjekke og håndheve beste praksis i våre CSS-filer. Følgende instruksjon kan følges på alle tre plattformene: OSX, Windows og Linux. Jeg antar at du allerede har installert Node.js med NPM.

For å installere Stylelint, kjør:

 npm installer -g stylelint 

Merk at du også må legge til en Stylelint-konfigurasjonsfil i prosjektkatalogen, i tillegg installere en forhåndsdefinert konfigurasjon som stylelint-config-standard. Når disse er konfigurert, bør du finne feilene uthevet som nedenfor.

Installere ESLint

Vi skal også installere ESLint, en moderne og svært konfigurerbar linter for JavaScript. Dette vil hjelpe oss med å håndheve beste praksis, samt få mulige feil når du skriver JavaScript. Installere ESLint krever også Node.js med NPM.

For å installere det, kjør.

 npm installer -g eslint 

På samme måte må du legge til ESLint-konfigurasjonen til prosjektet ditt, eller bruke forhåndsdefinert konfigurasjon som eslint-config-recommended.

Vi er alle satt. Vi kan starte linting HTML, CSS, JS og PHP i SublimeText ved hjelp av SublimeLinter 4.

Nye funksjoner i SublimeLinter 4

SublimeLinter 4 bringer flere nye funksjoner, og en som lett kan merkes er panelet som viser alle feilene i de åpnede filene. Hvis du er i Mac, trykker du på Command + Ctrl + A. I Windows og Linux kan du trykke Ctrl + K, Ctrl + A.

Hurtigasten vil vise en liste over feil, som vist i følgende skjermbilde.

Bruke ↑ og ↓ for å navigere i listen, og siden vil rulle til den nøyaktige linjen der feilen oppstod.

Bedre visuell

Vi kan nå svinge over randen i redigeringsprogrammet eller bare linjen der feilen oppstår for å se feilmeldingen. Dette var ikke mulig i den forrige versjonen.

Kan konfigureres

SublimeLinter 4 er nå mer konfigurerbar enn noensinne. For eksempel kan vi nå tilpasses “stiler” til hver av linterkonfigurasjonen. Dette tillater oss å angi ikoner, farge, lintmodus, bane og miljøvariabler for hver linter separat.

Ytterligere referanse

Jeg håper at denne korte introduksjonen kan hjelpe deg med å komme i gang med SublimeLinter. Du kan også referere til referansen hvis du vil ha mer avanserte ting.

• SublimeLinter Offisiell Dok
• Lint i programvare og programmering - WikiPedia
• SublimeLinter Repositories