Przewodnik po używaniu SublimeLinter dla programistów

Linter jest niezbędnym narzędziem w nowoczesnym tworzeniu stron internetowych. Pomaga nam kontrolować błędy i egzekwować najlepsze praktyki podczas pisania kodów. Jeśli używasz SublimeText, gorąco polecam zainstalowanie SublimeLinters. Przez lata SublimeLinters stał się pakietem narzędzi do zarządzania energią w SublimeText i przyniósł oficjalne pakiety, które łączą się z linterami różnych języków programowania.

W tym samouczku zobaczymy, jak zainstalować i skonfigurować SublimeLinter. Zacznijmy.

Rozpoczęcie pracy

Najprostszym sposobem zainstalowania SublimeLinter 4 jest kontrola pakietów SublimeText. Od tamtej pory SublimeLinter 3, każdy linter należy zainstalować osobno. Dzięki temu SublimeLinter może działać wydajniej, uruchamiając tylko linters które zainstalowaliśmy.

Ponieważ przez większość czasu używam HTML, CSS, JS i PHP w moich projektach, chciałbym zainstalować linters dla tych języków. w Kontrola pakietów, Instaluję SublimeLinter wraz z następującymi wtyczkami:

• SublimeLinter-html-tidy
• SublimeLinter-stylelint
• SublimeLinter-eslint
• SublimeLinter-php

Następnie, aby te wtyczki działały, musimy również zainstalować linter dla języków, które są HTML Tidy, CSSLint, JSHint i PHP CLI.

Dla tych, którzy używają OSX, Tidy i PHP są wstępnie zainstalowane w systemie. Aby zweryfikować, uruchom kolejno następujące dwa polecenia.

 tvers --version php --version 

Te polecenia pokażą Ci wersję Tidy i PHP. Możesz przystąpić do używania ich w Sublime Text.

Jeśli pracujesz w systemie Windows lub Linux lub nie masz ich zainstalowanych, możesz wykonać poniższe instrukcje.

Instalacja HTML Tidy

Aby zainstalować HTML Tidy:

• W OSX, uruchom to polecenie w Terminalu zaparz instalację homebrew / dupes / tidy
• W Linuksie, użyj tego polecenia sudo apt-get install tidy.
• W systemie Windows, możesz pobrać instalator EXE z TidyBatchFiles.

Instalowanie CLI PHP

• Użytkownicy OSX mogą zainstalować PHP w systemie za pomocą curl -s http://php-osx.liip.ch/install.sh | bash -s 5.5 dowództwo. Spowoduje to zainstalowanie PHP 5.5, który jest najnowszą wersją w momencie pisania.
• Linux użytkownicy mogą śledzić ten obszerny poradnik z DigitalOcean.
• Dla użytkowników systemu Windows, możesz pobrać instalator tutaj.

Instalowanie Styleinta

Następnie zainstalujemy linter CSS o nazwie Stylelint, który pozwoli nam sprawdzać i egzekwować najlepsze praktyki w naszych plikach CSS. Poniższa instrukcja może być stosowana na wszystkich trzech platformach: OSX, Windows i Linux. Zakładam, że już zainstalowałeś Node.js z NPM.

Aby zainstalować Stylelint, uruchom:

 npm install -g stylelint 

Zauważ, że będziesz musiał także dodać plik konfiguracyjny Stylelint do swojego katalogu projektu, dodatkowo zainstaluj predefiniowaną konfigurację, taką jak stylelint-config-standard. Po skonfigurowaniu należy znaleźć podświetlone błędy jak poniżej.

Instalowanie ESLint

Zamierzamy także zainstalować ESLint, nowoczesny i wysoce konfigurowalny linter dla JavaScript. To pomoże nam egzekwować najlepsze praktyki, a także wykrywać potencjalne błędy podczas pisania JavaScript. Instalacja ESLint wymaga również Node.js z NPM.

Aby go zainstalować, uruchom.

 npm zainstaluj -g eslint 

Podobnie, musisz dodać konfigurację ESLint do swojego projektu lub użyć predefiniowanej konfiguracji, takiej jak eslint-config-recommended.

Jesteśmy gotowi. Możemy zacząć strzępienie HTML, CSS, JS i PHP w SublimeText za pomocą SublimeLinter 4.

Nowe funkcje w SublimeLinter 4

SublimeLinter 4 zawiera kilka nowych funkcji, a łatwo zauważalny jest panel wyświetlający wszystkie błędy otwartych plików. Jeśli jesteś w Macu, naciśnij Command + Ctrl + A. W Windows i Linux możesz nacisnąć Ctrl + K, Ctrl + A.

Klawisz skrótu wyświetli listę błędów, jak pokazano na poniższym zrzucie ekranu.

Użyj ↑ i ↓ aby poruszać się po liście, a strona przewinie do dokładnej linii, w której wystąpił błąd.

Lepszy wizualny

Możemy teraz najechać kursorem na rynnę w edytorze lub po prostu linię, w której wystąpił błąd, aby wyświetlić komunikat o błędzie. Nie było to możliwe w poprzedniej wersji.

Wysoce konfigurowalny

SublimeLinter 4 jest teraz bardziej konfigurowalny niż kiedykolwiek wcześniej. Na przykład możemy teraz spersonalizować “style” do każdej konfiguracji lintera. To pozwala nam ustawić ikony, kolor, tryb linków, ścieżkę i zmienne środowiskowe dla każdego lintera oddzielnie.

Dalsze informacje

Mam nadzieję, że to krótkie wprowadzenie może pomóc w uruchomieniu SublimeLinter. Możesz również odwołać się do odniesienia, jeśli chcesz więcej zaawansowanych rzeczy.

• SublimeLinter Official Doc
• Lint w oprogramowaniu i programowaniu - WikiPedia
• Repozytoria SublimeLinter