<commit_before>#  [![NPM version][npm-image]][npm-url] [![Build Status][travis-image]][travis-url] [![Dependency Status][daviddm-url]][daviddm-image]

> Generate service worker code that will precache specific resources.
See the [background doc](background.md) for more information.


## Install

```sh
$ npm install --save-dev sw-precache
```


## Usage

### Overview

1. **Make sure your site is served using HTTPS!**
Service worker functionality is only available on pages that are accessed via HTTPS.
(`http://localhost` will also work, to facilitate testing.) The rationale for this restriction is
outlined in the
["Prefer Secure Origins For Powerful New Features" document](http://www.chromium.org/Home/chromium-security/prefer-secure-origins-for-powerful-new-features).

2. **Incorporate `sw-precache` into your `node`-based build script.**
It should work well with either `gulp` or `Grunt`, or other build scripts that run on `node`.
As part of the build process, `sw-precache` generates fully functional JavaScript code that will
take care of precaching and fetching all the resources your site needs to function offline.

3. **Register the service worker JavaScript.**
The JavaScript that's generated needs to be registered as the controlling service worker for your
pages. This technically only needs to be done from within a top-level "entry" page for your site,
since the registration includes a
[`scope`](https://slightlyoff.github.io/ServiceWorker/spec/service_worker/index.html#service-worker-registration-scope)
which will apply to all pages underneath your top-level page.
[`service-worker-registration.js`](https://github.com/jeffposnick/sw-precache/blob/master/demo/app/js/service-worker-registration.js)
is a sample script that illustrates the best practices for registering the generated service worker
code and handling the various
[lifecycle](https://slightlyoff.github.io/ServiceWorker/spec/service_worker/index.html#service-worker-state.1) events.

### Example

The project's [sample `gulpfile.js`](https://github.com/jeffposnick/sw-precache/blob/master/demo/gulpfile.js)
illustrates its full usage in context; `sw-precache` generates valid JavaScript code and
then writes it to a local directory as `service-worker.js`.

Here's a simpler example for a basic use case. It assumes your site's resources are located under
`app` and that you'd like to cache *all* your JavaScript, HTML, CSS, and image files.

    gulp.task('generate-service-worker', function(callback) {
      var fs = require('fs');
      var swPrecache = require('sw-precache');
      var rootDir = 'app';

      swPrecache({
        staticFileGlobs: [rootDir + '/**/*.{js,html,css,png,jpg,gif}'],
        stripPrefix: rootDir
      }, function(error, serviceWorkerFileContents) {
        if (error) {
          return callback(error);
        }
        fs.writeFile(path.join(rootDir, 'service-worker.js'), serviceWorkerFileContents, callback);
      });
    });<commit_msg>Trimmed a variable name.<commit_after>#  [![NPM version][npm-image]][npm-url] [![Build Status][travis-image]][travis-url] [![Dependency Status][daviddm-url]][daviddm-image]

> Generate service worker code that will precache specific resources.
See the [background doc](background.md) for more information.


## Install

```sh
$ npm install --save-dev sw-precache
```


## Usage

### Overview

1. **Make sure your site is served using HTTPS!**
Service worker functionality is only available on pages that are accessed via HTTPS.
(`http://localhost` will also work, to facilitate testing.) The rationale for this restriction is
outlined in the
["Prefer Secure Origins For Powerful New Features" document](http://www.chromium.org/Home/chromium-security/prefer-secure-origins-for-powerful-new-features).

2. **Incorporate `sw-precache` into your `node`-based build script.**
It should work well with either `gulp` or `Grunt`, or other build scripts that run on `node`.
As part of the build process, `sw-precache` generates fully functional JavaScript code that will
take care of precaching and fetching all the resources your site needs to function offline.

3. **Register the service worker JavaScript.**
The JavaScript that's generated needs to be registered as the controlling service worker for your
pages. This technically only needs to be done from within a top-level "entry" page for your site,
since the registration includes a
[`scope`](https://slightlyoff.github.io/ServiceWorker/spec/service_worker/index.html#service-worker-registration-scope)
which will apply to all pages underneath your top-level page.
[`service-worker-registration.js`](https://github.com/jeffposnick/sw-precache/blob/master/demo/app/js/service-worker-registration.js)
is a sample script that illustrates the best practices for registering the generated service worker
code and handling the various
[lifecycle](https://slightlyoff.github.io/ServiceWorker/spec/service_worker/index.html#service-worker-state.1) events.

### Example

The project's [sample `gulpfile.js`](https://github.com/jeffposnick/sw-precache/blob/master/demo/gulpfile.js)
illustrates its full usage in context; `sw-precache` generates valid JavaScript code and
then writes it to a local directory as `service-worker.js`.

Here's a simpler example for a basic use case. It assumes your site's resources are located under
`app` and that you'd like to cache *all* your JavaScript, HTML, CSS, and image files.

    gulp.task('generate-service-worker', function(callback) {
      var fs = require('fs');
      var swPrecache = require('sw-precache');
      var rootDir = 'app';

      swPrecache({
        staticFileGlobs: [rootDir + '/**/*.{js,html,css,png,jpg,gif}'],
        stripPrefix: rootDir
      }, function(error, swFileContents) {
        if (error) {
          return callback(error);
        }
        fs.writeFile(path.join(rootDir, 'service-worker.js'), swFileContents, callback);
      });
    });
{'fraction_non_alphanumeric': 0.11189873417721519, 'fraction_numerical': 0.001350210970464135, 'mean_word_length': 4.481961147086031, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 5, 'https://': 8, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '432669', 'n_tokens_mistral': 1702, 'n_tokens_neox': 1636, 'n_words': 589}