workbox-cli

Interfejs wiersza poleceń Workbox (zawarty w pakiecie workbox-cli) składa się z programu Node.js o nazwie Workbox, który można uruchomić w środowisku wiersza poleceń Windows lub macOS zgodnym z systemem UNIX. Interfejs wiersza poleceń pakuje moduł kompilacji obszaru roboczego i zapewnia łatwy sposób integracji Workbox z procesem tworzenia wiersza poleceń za pomocą elastycznych konfiguracji.

Instalowanie interfejsu wiersza poleceń

Aby zainstalować interfejs wiersza poleceń z węzłem, uruchom w terminalu to polecenie:

npm install workbox-cli --global

Tryby interfejsu wiersza poleceń

Interfejs wiersza poleceń ma 4 tryby:

  • wizard: szczegółowy przewodnik konfigurowania Workbox dla swojego projektu.
  • generateSW: generuje dla Ciebie kompletny skrypt service worker.
  • injectManifest: wstrzykuje zasoby do wstępnego buforowania w projekcie.
  • copyLibraries: skopiuj biblioteki Workbox do katalogu.

wizard

Kreator Workbox zadaje serię pytań dotyczących konfiguracji katalogu lokalnego oraz plików, które mają być buforowane. Twoje odpowiedzi służą do wygenerowania pliku konfiguracji, którego można używać podczas działania w trybie generateSW.

Większość programistów wystarczy uruchomić kreatora pól roboczych tylko raz i możesz ręcznie dostosować wygenerowany plik konfiguracji początkowej, korzystając z dowolnej z obsługiwanych opcji konfiguracji kompilacji.

Aby rozpocząć uruchomienie kreatora:

npx workbox-cli wizard

Zrzut ekranu z kreatorem interfejsu wiersza poleceń Workbox

generateSW

Możesz użyć interfejsu wiersza poleceń Workbox, aby wygenerować kompletny skrypt service worker za pomocą pliku konfiguracji (np. pliku wygenerowanego przez kreatora).

Po prostu uruchom to polecenie:

npx workbox-cli generateSW path/to/config.js

Trybu generateSW zalecamy deweloperom, którzy są zadowoleni z wbudowanych funkcji buforowania i pamięci podręcznej w czasie działania Workbox oraz takich, którzy nie muszą dostosowywać działania skryptu service worker.

Kiedy używać generateSW

  • Chcesz buforować pliki.
  • Nie ma potrzeby tworzenia pamięci podręcznej środowiska wykonawczego.

Kiedy NIE używać generateSW

  • Chcesz użyć innych funkcji skryptu Service Worker (np. Web Push).
  • Chcesz zaimportować dodatkowe skrypty lub dodać dodatkowe funkcje logiczne niestandardowych strategii buforowania.

injectManifest

Deweloperzy, którzy chcą mieć większą kontrolę nad końcowym plikiem skryptu service worker, mogą użyć trybu injectManifest. Ten tryb zakłada, że istnieje plik skryptu service worker (jego lokalizacja jest określona w pliku config.js).

Po uruchomieniu workbox injectManifest szuka konkretnego ciągu znaków (domyślnie precacheAndRoute(self.__WB_MANIFEST)) w źródłowym pliku skryptu service worker. Zastępuje pustą tablicę listą adresów URL do wstępnego buforowania i zapisuje plik skryptu service worker w miejscu docelowym zgodnie z opcjami konfiguracji w config.js. Pozostała część kodu źródłowego skryptu service worker pozostaje niezmieniona.

Z Workbox możesz korzystać w tym trybie:

npx workbox-cli injectManifest path/to/config.js

Kiedy używać injectManifest

  • Chcesz mieć większą kontrolę nad skryptem service worker.
  • Chcesz buforować pliki.
  • Musisz dostosować trasy i strategie.
  • Chcesz używać skryptu service worker z innymi funkcjami platformy (np. Web Push).

Kiedy NIE używać injectManifest

  • Chcesz dodać skrypt service worker do swojej witryny?

copyLibraries

Ten tryb jest przydatny, jeśli chcesz używać injectManifest i chcesz używać plików biblioteki Workbox hostowanych w Twoim źródle zamiast sieci CDN.

Musisz tylko uruchomić go ze ścieżką zapisu plików w:

npx workbox-cli copyLibraries third_party/workbox/

Integracja procesu kompilacji

Dlaczego Workbox wymaga integracji z moim procesem kompilacji?

Projekt Workbox zawiera wiele bibliotek, które współdziałają, aby obsługiwać skrypt service worker aplikacji internetowej. Aby skutecznie korzystać z tych bibliotek, musisz zintegrować Workbox z procesem kompilacji aplikacji internetowej. Dzięki temu skrypt service worker może skutecznie buforować wszystkie ważne treści aplikacji internetowej i dbać o ich aktualność.

Czy workbox-cli to dla mnie najlepszy wybór dla mojej firmy?

Jeśli masz już proces kompilacji oparty w całości na skryptach npm, workbox-cli jest dobrym wyborem.

Jeśli obecnie używasz pakietu webpack jako narzędzia do kompilacji, lepszym wyborem jest workbox-webback-plugin.

Jeśli używasz obecnie Gulp, Grunt lub innego narzędzia do kompilacji opartego na Node.js, lepszym rozwiązaniem jest zintegrowanie workbox-build ze swoim skryptem kompilacji.

Jeśli nie masz procesu kompilacji, musisz go wymyślić, zanim użyjesz Workbox w celu wstępnego buforowania zasobów. Próba zapamiętania ręcznego uruchomienia interfejsu workbox-cli może prowadzić do błędów, a zapomnienie uruchomienia może prowadzić do wyświetlania nieaktualnych treści użytkownikom.

Konfiguracja

Po zainstalowaniu workbox-cli jako zależności programistycznej w projekcie lokalnym możesz dodać wywołanie do workbox na końcu skryptu npm istniejącego procesu kompilacji:

Z pliku package.json:

{
  "scripts": {
    "build": "my-build-script && workbox <mode> <path/to/config.js>"
  }
}

Zastąp <mode> wartością generateSW lub injectManifest (w zależności od przypadku użycia) i <path/to/config.js> ścieżką do opcji konfiguracji. Twoja konfiguracja mogła zostać utworzona automatycznie przez użytkownika workbox wizard lub zmodyfikowana ręcznie.

Konfiguracja

Opcje używane przez aplikację generateSW

Pełny zestaw opcji konfiguracyjnych można znaleźć w dokumentacji referencyjnej.

Opcje używane przez aplikację injectManifest

Pełny zestaw opcji konfiguracyjnych można znaleźć w dokumentacji referencyjnej.