Aurelia + Workbox

Bei Workbox handelt es sich um ein sehr interessantes Projekt von Google, welches den ganzen Boilerplate, den es normalerweise benötigt um eine Web-App offline-fähig zu machen, wesentlich reduziert. Die Verwendung in Kombination mit Webpack ist sehr einfach. Daher habe ich ein kleines Beispiel erstellt, welches die Kombination von Aurelia mit Workbox zeigt. Hier der Link zum GitHub-Repository: https://github.com/stenet/au-workbox.

Was steckt dahinter?

Als erstes habe ich eine neue Aurelia-Anwendung mittels der Aurelia-CLI erstellt. Falls diese noch nicht vorhanden ist, muss diese zuerst installiert werden:

npm i aurelia-cli -g

Dann die Anwendung erstellen

au new --here

Wichtig: als Bundler Webpack auswählen!

Anschließend, nachdem das Projekt fertig erstellt ist, noch das Workbox-Webpack-Plugin installieren

npm i workbox-webpack-plugin -D

Dieses muss anschließend in der webpack.config.js noch hinterlegt werden. Der restliche relevante Code steckt in der sw-service.ts.

Das war’s schon. Jetzt ist die die Anwendung selbst offline-fähig. Was die Offline-Fähigkeit der Daten z.B. zu einem REST-Service angeht, so könnte dies nun z.B. mittels LocalStorage oder IndexedDB.