Publikacja i hosting

Do tej pory działaliśmy na Fronthacku tylko w trybie developerskim. Kiedy prace zostaną ukończone, bądź zechcemy pokazać dotychczasowe rezultaty, możemy użyć w tym celu GitHub Pages. Oczywiście warunkiem jest hostowanie repozytorium na GitHubie.

Wykonanie builda produkcyjnego

Build produkcyjny to wygenerowanie z plików źródłowych znajdujących się w katalogu src, gotowej do hostowania dystrybucji w katalogu dist. Wersja produkcyjna różni się od wersji developerskiej tym, że plik ze stylami jest zminifikowany, tak samo style CSS. Utrudnia to debugowanie, ale zmniejsza rozmiar plików, które musimy zaserwować przeglądarce przy wyświetleniu strony. Ponadto build produkcyjny automatycznie kompresuje wszystkie pliki graficzne w katalogu images, tak aby zarówno ich rozmiar jak i utrata jakości były jak najmniejsze. Do wykonania builda produkcyjnego służy następująca komenda:

npm run build

Zawartość wygenerowanego w ten sposób katalogu dist jest zupełnie samodzielna, tzn zawiera w sobie wszystkie niezbędne do prawidłowego wyświetlania pliki.

Deployment do GitHub Pages

Jeżeli hostujesz repozytorium projektu na GitHubie, masz do swojej dyspozycji GitHub Pages - darmowy hosting dla Twojego kodu. Aby wypuścić swój projekt na GitHub Pages, wykonaj następującą komendę:

npm run deploy

Co się dzieje pod spodem?

Komenda npm run deploy zbiera zwartość katalogu dist i tworzy z niej nowego brancha o nazwie gh-pages który zostaje pushnięty na GitHuba. Po takiej operacji nasz build będzie widoczny pod adresem https://nazwauzytkownika.github.io/nazwaprojektu .


Improve this page