Steal-serviceworker NPM

steal-serviceworker

steal-serviceworker helps you to create a service worker for your app that’s built with steal-tools.

Usage

build.js

const stealTools = require("steal-tools");
const precache = require("steal-serviceworker");


stealTools.build({
    config: __dirname + "/basics/package.json!npm"
}).then(function(buildResult){
    
   precache(buildResult);
   
});

index.html

<script src="/dist/steal.production.js"></script>

It's that easy?

API

precache(bundleResult, options) => Promise

precache does two things for you:

Generates a service worker that contains all the files that steal-tools bundles into the dest folder
Creates a basic service worker registration. precache can put this code into its own file or prepend the code into steal.production.js for you.

buildResult

The BuildResult obtained from calling stealTools.build.

options

An optional object for specifying additional options. They are:

`bundleRegistration` boolean

Write the service worker registration template into steal.production.js or not. If false the registration code gets written into a file named service-worker-registration.js into the dest folder. You have to include the registration script yourself <script src="/dist/service-worker-registration.js"></script>

Default: false

`cacheRegistration` boolean

Defines if the service worker registration code is cached by the service worker as well. This option only make sense if bundleRegistration is false.

`filename` string

The name of the service worker file.

Default: service-worker.js

`registrationTemplate` string

You can use your own registration for the service worker. E.g. you can handle the state of the service worker and can implement your own custom behaviors if the content of the cache changed.

Default: path.join(__dirname, "service-worker-registration.tmpl")

all options provided by Google’s sw-precache

precache(buildResult, {
    staticFileGlobs: [
        path.join(__dirname, "dist", '**', '*.*'),
        path.join(__dirname, "src", "styles.css")
    ],
    runtimeCaching: [{
        urlPattern: "/",
        handler: "networkFirst"
    }]
});