Guide till användning av SublimeLinter för utvecklare

Linter är ett oumbärligt verktyg i modern webbutveckling. Det hjälper oss att hålla koll på fel och genomdriva bästa praxis när du skriver koder. Om du använder SublimeText rekommenderar jag starkt att installera SublimeLinters. Under årens lopp har SublimeLinters utvecklats till att vara ett verktygssuite i SublimeText och tog med officiella paket som kopplar till linjer i olika programmeringsspråk.

I den här handledningen ser vi hur du installerar och installerar SublimeLinter. Låt oss bara komma igång.

Komma igång

Det enklaste sättet att installera SublimeLinter 4 är genom paketkontrollen SublimeText. Ända sedan in SublimeLinter 3, varje slinter måste installeras separat. Detta gör att SublimeLinter kan köras mer effektivt genom att bara köra linters som vi har installerat.

Eftersom jag använder HTML, CSS, JS och PHP för det mesta i mina projekt, vill jag installera linjer för dessa språk. I Paketkontroll, Jag installerar SublimeLinter tillsammans med följande plugins:

• SublimeLinter-html-snyggt
• SublimeLinter-stylelint
• SublimeLinter-eslint
• SublimeLinter-php

För att pluggarna ska kunna fungera måste vi också installera slinter för språken, som är HTML Tidy, CSSLint, JSHint och PHP CLI.

För dig som använder OSX, är Tidy och PHP förinstallerade i systemet. För att verifiera, kör följande två kommandon i följd.

 städa --version php - version 

Dessa kommandon visar dig Tidy och PHP-versionen du har. Du kan fortsätta använda dem i Sublime Text.

Om du är på Windows eller Linux, eller inte har dem installerade, kan du följa anvisningarna nedan.

Installera HTML Tidy

Så här installerar du HTML Tidy:

• I OSX, kör det här kommandot i Terminal brygga installera homebrew / dupes / städa
• I Linux, använd det här kommandot sudo apt-få installera snyggt.
• I Windows, du kan ta tag i EXE-installationsprogrammet från TidyBatchFiles.

Installera PHP CLI

• OSX-användare kan installera PHP i systemet med curl -s http://php-osx.liip.ch/install.sh | bash-s 5,5 kommando. Detta installerar PHP 5.5, vilket är den senaste versionen, vid skrivets gång.
• Linux Användare kan följa denna omfattande handledning från DigitalOcean.
• För Windows-användare, Du kan ladda ner installationsprogrammet här.

Installera Styleint

Därefter installerar vi CSS-lentaren som heter Stylelint som gör att vi kan kontrollera och tillämpa bästa praxis i våra CSS-filer. Följande anvisning kan följas på alla tre plattformar: OSX, Windows och Linux. Jag antar att du redan har installerat Node.js med NPM.

För att installera Stylelint, kör:

 npm installera -g stylelint 

Observera att du också måste lägga till en Stylelint-konfigurationsfil i din projektkatalog, installera dessutom en fördefinierad konfiguration som stylelint-config-standard. När dessa är konfigurerade bör du hitta de fel som är markerade enligt nedan.

Installera ESLint

Vi kommer också att installera ESLint, en modern och mycket konfigurerbar linter för JavaScript. Detta kommer att hjälpa oss att genomdriva bästa praxis samt fånga möjliga fel vid skrivning av JavaScript. Installera ESLint kräver också Node.js med NPM.

För att installera det kör du.

 npm installera -g eslint 

På samma sätt måste du lägga till ESLint-konfigurationen för ditt projekt, eller använd den fördefinierade konfigurationen som eslint-config-rekommenderad.

Vi är redo. Vi kan börja luddning HTML, CSS, JS och PHP i SublimeText med SublimeLinter 4.

Nya funktioner i SublimeLinter 4

SublimeLinter 4 ger flera nya funktioner, och en som lätt kan märkas är panelen som visar alla fel i de öppna filerna. Om du är i Mac trycker du på Command + Ctrl + A. I Windows och Linux kan du trycka på Ctrl + K, Ctrl + A.

Snabbknappen visar en lista med fel, som visas i följande skärmdump.

Använd ↑ och ↓ för att navigera i listan, och sidan bläddrar till den exakta raden där felet inträffade.

Bättre visuellt

Vi kan nu sväva över rännan i redigeraren eller bara raden där felet händer för att visa felmeddelandet. Detta var inte möjligt i den tidigare versionen.

Mycket konfigurerbar

SublimeLinter 4 är nu mer konfigurerbar än någonsin tidigare. Till exempel kan vi nu anpassas “stilar” till var och en av linterkonfigurationen. Detta gör det möjligt för oss att ställa in ikoner, färg, luddläge, sökväg och miljövariabler för varje linter separat.

Ytterligare referens

Jag hoppas att den här korta introduktionen kan hjälpa dig att komma igång med SublimeLinter. Du kan också referera till referensen om du vill ha mer avancerade saker.

• SublimeLinter Officiellt dokument
• Lint i programvara och programmering - WikiPedia
• SublimeLinter Repositories