Průvodce použití SublimeLinter pro vývojáře

Linter je nepostradatelným nástrojem v moderním vývoji webu. Pomáhá nám to udržet v kontrole s chybami a prosazovat nejlepší postupy při psaní kódů. Pokud používáte SublimeText, doporučuji nainstalovat SublimeLinters. SublimeLinters se v průběhu let stal v SublimeTextu sadou elektrických nástrojů a přinesl oficiální balíčky, které se připojují k linterům různých programovacích jazyků..

V tomto tutoriálu uvidíme, jak nainstalovat a nastavit SublimeLinter. Začněme.

Začínáme

Nejjednodušší způsob instalace SublimeLinter 4 je prostřednictvím SublimeText Package Control. Od té doby SublimeLinter 3, každý linter musí být instalován samostatně. To umožňuje SublimeLinter spustit efektivněji pouze spuštěním linters které jsme nainstalovali.

Protože používám HTML, CSS, JS a PHP většinu času v mých projektech, rád bych pro tyto jazyky nainstaloval linters. V Ovládání balíčku, SublimeLinter instaluji společně s následujícími pluginy:

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

Aby tyto pluginy fungovaly, musíme také nainstalovat linter pro jazyky, kterými jsou HTML Tidy, CSSLint, JSHint a PHP CLI.

Pro ty z vás, kteří používají OSX, jsou Tidy a PHP předinstalovány v systému. Chcete-li ověřit, spusťte následující dva příkazy postupně.

 uklizený --version php --version 

Tyto příkazy vám ukáží verzi Tidy a PHP, kterou máte. Můžete je použít v Sublime Textu.

Pokud se nacházíte ve Windows nebo Linuxu nebo nemáte nainstalované, můžete postupovat podle níže uvedených pokynů.

Instalace HTML Tidy

Pro instalaci HTML Tidy:

• V OSX, spusťte tento příkaz v terminálu vařit instalaci homebrew / dupes / uklizené
• V Linuxu, použijte tento příkaz sudo apt-get install tidy.
• V systému Windows, můžete chytit EXE instalační program z TidyBatchFiles.

Instalace PHP CLI

• Uživatelé OSX mohou instalovat PHP do systému pomocí curl -s http://php-osx.liip.ch/install.sh | bash -s 5.5 příkaz. To bude instalovat PHP 5.5, což je poslední verze, v době psaní.
• Linux uživatelé mohou sledovat tento obsáhlý návod z DigitalOcean.
• Pro uživatele systému Windows, Instalační program si můžete stáhnout zde.

Instalace softwaru Styleint

Dále nainstalujeme CSS linter nazvaný Stylelint, který nám umožní kontrolovat a prosazovat osvědčené postupy v našich souborech CSS. Následující instrukce lze sledovat ve všech třech platformách: OSX, Windows a Linux. Předpokládám, že jste již nainstalovali Node.js s NPM.

Chcete-li nainstalovat aplikaci Stylelint, spusťte:

 npm install -g stylelint 

Všimněte si, že budete také muset přidat konfigurační soubor Stylelint do adresáře projektu, dodatečně nainstalovat předdefinovanou konfiguraci, jako je stylelint-config-standard. Jakmile jsou tyto nakonfigurovány, měli byste najít chyby zvýrazněné níže.

Instalace ESLint

Budeme také instalovat ESLint, moderní a vysoce konfigurovatelný linter pro JavaScript. To nám pomůže prosadit osvědčené postupy, stejně jako potenciální chyby při psaní JavaScriptu. Instalace ESLint také vyžaduje Node.js s NPM.

Chcete-li jej nainstalovat, spusťte jej.

 npm install -g eslint 

Podobně budete muset do projektu přidat konfiguraci ESLint nebo použít předdefinovanou konfiguraci, například eslint-config-recommended..

Všichni jsme nastaveni. Můžeme začít obložení HTML, CSS, JS a PHP ve SublimeTextu pomocí SublimeLinter 4.

Nové funkce v SublimeLinter 4

SublimeLinter 4 přináší několik nových funkcí a ten, který je snadno viditelný, je panel, který zobrazuje všechny chyby otevřených souborů. Pokud jste v systému Mac, stiskněte klávesu Command + Ctrl + A. V systémech Windows a Linux můžete stisknout klávesy Ctrl + K, Ctrl + A.

Klávesová zkratka zobrazí seznam chyb, jak ukazuje následující obrázek.

Použijte ↑ a ↓ procházet seznam a stránka přejde na přesný řádek, kde došlo k chybě.

Lepší vizuální

Můžeme nyní přejít nad žlábkem v editoru nebo jen na řádek, kde došlo k chybě a zobrazit chybové hlášení. To nebylo v předchozí verzi možné.

Vysoce konfigurovatelné

SublimeLinter 4 je nyní konfigurovatelnější než kdykoliv předtím. Můžeme si například zvyknout “styly” do každé konfigurace linter. To nám umožňuje nastavit ikony, barvu, režim chlupů, cestu a proměnné prostředí pro každý linter zvlášť.

Další reference

Doufám, že tento krátký úvod by mohl pomoci dostat se nahoru a běžet s SublimeLinter. Můžete také odkazovat na odkaz, pokud chcete více pokročilých věcí.

• SublimeLinter Official Doc
• Lint v softwaru a programování - WikiPedia
• SublimeLinter Repository