Od skryptu shella do Grunta

Od kiedy pracuję nad dużymi projektami ze skomplikowanym frontendem, korzystam z dobrodziejstw takich narzędzi jak Node.js i paczki npm. Na początku wołałem odpowiednie paczki Node.js ręcznie, ale takie podejście szybko robi się niewygodne. Grunt pojawił się jak spod ziemi w momencie, gdy potrzebowałem zrobić coś kompletnie od czapy.

Gdy niewygoda ręcznego wywoływania paczek Node.js zaczęła być zbyt upierdliwa, natychmiast przeszedłem do wygodniejszych rozwiązań i automatyzacji procesu. Automatyzacja została oddelegowana w pewnym momencie do skryptów shella, które można było zawołać ręcznie, a dodatkowo obowiązkowo wołane były podczas wdrażania projektu. Przez dłuższy czas było to wystarczająco wygodne. Ale nic nie jest wieczne.

Grunt pojawił się jak spod ziemi w momencie, gdy potrzebowałem zrobić coś niecodziennego: dodać obsługę gettext do templatek HTML wykorzystywanych przez Angular.js. Jest do tego odpowiednia paczka bowera, ale wyciągnięcie stringów do tłumaczeń i wepchnięcie ich w katalog .pot, a później użycie gotowego pliku .po do stworzenia czegoś, czego można użyć w JavaScripcie było zadaniem nierealnym bez pomocy dwóch zadań Grunta. Zainstalowałem je „na próbę” i zadziałały bez najmniejszego zająknięcia się — Grunt więc został niejako „z automatu” moim przyjacielem.

A skoro już korzystałem z dwóch tasków, to dlaczego nie skorzystać z kolejnych? Po to przecież są, żeby ułatwiać życie. Doinstalowałem zatem kolejne paczki: grunt-contrib-concat, grunt-contrib-uglify i grunt-contrib-less, a dodatkowo jeszcze grunt-line-remover.

W stosunku do napisania zwykłego skryptu shellowego z początku nie widać różnic. W obu przypadkach wołamy sobie jakąś komendę, która bierze jakieś z góry określone pliki i wypluwa inne. Ale po pewnym czasie zalety zaczynają być bardziej oczywiste.

Po pierwsze, katalogi. Nie ma już konieczności dbania o to, by katalog docelowy istniał. Nie jest to niby jakimś problemem, ale i tak przy każdym projekcie łapałem się na tym, że w świeżo sklonowanym repozytorium nie ma jeszcze katalogów docelowych na zminifikowane pliki JS i CSS i albo tworzyłem je ręcznie, albo dopisywałem odpowiedni kawałek skryptu, który zawsze sprawdzał istnienie katalogów i w razie konieczności, tworzył je.

Drugi plus jest taki, że można swobodnie przesiąść się na komputer z innym systemem operacyjnym. O ile do pracy zazwyczaj wykorzystuję Linuxa (cztery z pięciu komputerów w domu są pod kontrolą różnych dystrybucji tegoż OSa), o tyle czasem uruchamiam też swoją maszynkę do (głównie) giercowania. A pod Windowsem skrypty basha już nie działają, co sprawiało, że musiałem pisać drugą wersję każdego skryptu i dostosowywać ją do wymagań innego shella. Dzięku Gruntowi składnia nie jest problemem i można swobodnie korzystać z tego samego polecenia pod każdym systemem operacyjnym.

I wreszcie po trzecie (ale nie najmniej ważne), automatyzacja innych zadań. Problem był taki, że na maszynie deweloperskiej skrypty nie zawsze powinny być takie same. A to jakaś linijka była zakomentowana, a to dodana (a jak ktoś nieopatrznie wypchnął do repozytorium zakomentowane linijki z wersji deweloperskiej, to zawsze był o to krzyk). Dodatkowo, wyjściowe pliki w wersji deweloperskiej nie powinny być minifikowane, bo po prostu nie da się ich debugować. Grunt oferuje wiele tasków, które umożliwiają realizację tego typu zadań bez żadnego wysiłku.

O ile wspomnianego projektu korzystającego z gettexta po stronie klienta na razie udostępniać nie chcę (cierpliwości, kiedyś będzie działało!), o tyle pochwalić się mogę moją nową biblioteczką do zarządzania uprawnieniami (RBAC): uAccess1; zainteresowanych zapraszam do testowania (dokumentacji jako takiej nie ma; kiedyś dorobię). Projekt korzysta z Grunta i Karmy, a więc po zassaniu repozytorium odpalamy komendę:

npm install

Zainstaluje nam to wszystkie potrzebne paczki npm. Teraz można użyć następujących komend:

Odpalenie domyślnego zadania Grunta (konkatenacja plików):

node_modules/.bin/grunt

Odpalenie zadania przygotowującego wersję produkcyjną plików (konkatenacja i minifikacja):

node_modules/.bin/grunt dist

Uruchomienie testów jednostkowych (Karma + Jasmine):

node_modules/.bin/karma start

  1. Teraz to repozytorium zawiera tylko kod PHP. Część JS została wyodrębniona do oddzielnego repozytorium. Grunta można tam podziwiać w wersjach do 1.7.2, zaś od 2.0.0 pałeczkę przejął Gulp. Zainteresowanych odsyłam do pliku readme i zawartych w nim instrukcji. ↩︎


Napisz komentarz


Szukaj wpisów


Chmura tagów