Package manager na front? Bower w akcji…

Package manager na front? Bower w akcji…

Package managery to rzecz nie nowa, od dawna służąca nam w systemach UNIX-owych, a od pewnego czasu także na różnych platformach programistycznych. Np w takim Ruby instalujemy gem-y, w PHP-ie używamy Composera, w JS-ie (przy wykorzystaniu Node’a) paczki pochodzą z NPM-a. Wszystkie te narzędzia wykorzystujemy jednak do zarządzania zewnętrznymi zależnościami po stronie backend-u, po stronie frondend-u czegoś takiego nam brakowało, a lukę uzupełnić postanowił właśnie Bower…

Instalacja

Zaczniemy zatem od podstaw, Bowera instalujemy przy pomocy menadżera paczek z Node’a:

npm install bower -g 

Zarządzanie zależnościami

Następnie w głównym katalogu projektu umieszczamy dwa pliki bower.json oraz .bowerrc. Pierwszy będzie zawierał zależności, które będą wymagane do działania aplikacji, drugi m.in. ścieżkę do folderu z bibliotekami.
bower.json

{
    "name": "app",
    "version": "0.0.1",
    "dependencies": {
        "angular": "~1.0.7",
        "angular-mocks": "~1.0.7",
        "angular-socket-io": "~0.2.0"
    }
}

W linijce 2 i 3 deklarujemy nazwę oraz wersje aplikacji.
Zależności o które Bower zadba umieszczamy natomiast pod kluczem “dependencies“.
Składnia wygląda następująco:

"<nazwa_pakietu>" : ""

Dostępne paczki można znaleźć pod tym linkiem lub przy użyciu komendy:

bower search 

Warto jeszcze nadmienić, że oprócz zwykłych zależności możemy określić także te deweloperskie czyli niezbędne tylko w procesie tworzenia (testy), służy do tego klucz “devDependencies“. Zapewne będą one pobierane wyłącznie w repozytorium danego modułu, natomiast pominięte zostaną gdy nasz moduł zostanie dołączony do innego projektu jako jedna z zewnętrznych bibliotek.

.bowerr

{
  "directory": "client/js/lib/bower_components"
}

Sama konfiguracja nie jest zbyt zaawansowana, wystarczające jest podanie ścieżki gdzie wrzucona będą ściągnięte pliki.
Jeżeli chcemy uruchomić proces instalacji używamy jeszcze komendy:

bower install

Rejestracja własnego pakietu

Bower nie tylko umożliwia rozwiązywanie zależności, ale także w bardzo łatwy sposób pozwala na publikacje własnych modułów. Do dyspozycji dostajemy parę dodatkowych właściwości, które możemy, albo musimy uzupełnić.

main [string|tablica]
Wskazuje na główny plik moduły (np połączone pliki źródłowe, nie zminifikowane)

ignore [tablica]
Lista plików które nie zostaną zainstalowane, gdy ktoś będzie pobierał nasz moduł

license [string|tablica]
nazwa lub ścieżka do licencji

repository [objekt]
adres do repozytorium w którym znajduje się nasz moduł
przykład:

”repository: { “type”: “<vcs_type>”, “url”: “<repo_url>” }”

gdzie typem może być np “git”, a url-em “git@github.com:mkalafior/extjs4-zend-json-server.git”

Ostatecznie aby zarejestrować nasz moduł potrzebna będzie jeszcze jedna linijka:

bower register <nazwa> <git>

którą odpalamy w miejscu gdzie znajduje się nasz plik konfiguracyjny. Jeżeli wszystko przebiegło pomyślnie powinniśmy móc zainstalować nasz pakiet przez komendę:

bower install <nazwa_naszego_pakietu>
Komentarze:

Zostaw odpowiedź

Proszę wypełnij wymagane pola aby dodać komentarz.


Drag circle to the rectangle on the right!

Wyślij