W dniu dzisiejszym Bootstrap udostępnił Bootlint czyli narzędzie do wychwytywania oczywistych błędów w użyciu Bootstrap’a i sprawdzania składni. Lint to taki “uboższy kompilator” sprawdzający najczęściej popełniane błędy oraz analizujący kod. Bootlint działa wyłącznie z niemodyfikowaną wersją (vanilla) Bootstrap’a.

Projekt Bootlint dostępny jest na repozytorium GitHub’a i pozwala nam użyć narzędzia na 2 sposoby:

  • jako narzędzia linii poleceń,
  • bezpośrednio z poziomu przeglądarki załączając do kodu strony

Praca z poziomu wiersza poleceń

Aby zainstalować narzędzie należy posłużyć się menedżerem paczek dla node takim jak npm i z konsoli wywołać następującą komendę:

npm install -g bootlint

Po pobraniu wszystkich plików i instalacji narzędzie wywołujemy bezpośrednio z konsoli używając polecenia bootlint:

bootlint sciezka/do/pliku/html

Dla przykładu wywołanie bootlint index.php automatycznie sprawdzi kod znajdujący się w pliku index.php (statyczny HTML) i w konsoli będziemy mogli zaobserwować występujące błędy.

Bootlint terminal

Przy wykorzystaniu przeglądarki

Zdecydowanie prostszą metodą jest załączenie skryptu do kodu naszej strony i podejrzenie występujących problemów z konsoli przeglądarki. W tym celu najlepiej jest użyć pliku bootlint.js znajdującego się w pobranej z repozytorium paczce w katalogu dist/browser/.

Jeśli nasza witryna zawiera jakieś błędy Linter powita nas standardowym oknem alertu JavaScript:

Bootlint Browser

Po otworzeniu konsoli przeglądarki, np. w Chrome Developer Tools możemy podejrzeć występujące błędy, które są identyczne z komunikatami prezentowanymi w wierszu poleceń:

<head> is missing UTF-8 charset <meta> tag bootlint.js:9661
<head> is missing X-UA-Compatible <meta> tag that disables old IE compatibility modes bootlint.js:9661
Found one or more uses of outdated Bootstrap v2 <code>.spanN</code> grid classes

I tutaj istotna uwaga, wspierane jest tylko wydanie Bootstrap’a w wersji 3. Użycie tego narzędzie w starszej wersji tego framework’a zaowocuje błędami zbliżonymi do tych powyżej czyli:

Found one or more uses of outdated Bootstrap v2

w dniu .

Back to top