https://github.com/piraces/eleventy-plugin-pwa

An eleventy plugin to generate service-worker for PWA. Powered by Google Workbox
https://github.com/piraces/eleventy-plugin-pwa

11ty 11ty-plugin eleventy eleventy-plugin npm-package pwa workbox

Last synced: 3 months ago
JSON representation

An eleventy plugin to generate service-worker for PWA. Powered by Google Workbox

• Host: GitHub
• URL: https://github.com/piraces/eleventy-plugin-pwa
• Owner: piraces
• License: mit
• Fork: true (okitavera/eleventy-plugin-pwa)
• Created: 2021-06-25T20:16:11.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2023-03-28T20:58:36.000Z (over 1 year ago)
• Last Synced: 2024-09-18T16:05:41.720Z (3 months ago)
• Topics: 11ty, 11ty-plugin, eleventy, eleventy-plugin, npm-package, pwa, workbox
• Language: JavaScript
• Homepage: https://www.npmjs.com/package/@piraces/eleventy-plugin-pwa
• Size: 1.3 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 10
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# @piraces/eleventy-plugin-pwa

[![license: MIT](https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square)](LICENSE)

[![eleventy](https://img.shields.io/badge/staticgen-eleventy-%23707070.svg?style=flat-square)](https://11ty.io)

[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)

[![codecov](https://img.shields.io/codecov/c/github/piraces/eleventy-plugin-pwa.svg?style=flat-square)](https://codecov.io/gh/piraces/eleventy-plugin-pwa)

> An [Eleventy](https://11ty.io) plugin to generate service worker.

> Using Google Workbox to generate service-worker.js based on your `dir.output`.

### Note

This is a fork of the original work of @okitavera in [eleventy-plugin-pwa](https://github.com/okitavera/eleventy-plugin-pwa), providing up-to-date support with the latest versions of [Workbox](https://developers.google.com/web/tools/workbox/guides/get-started), [Eleventy](https://11ty.io) and other related dependencies (in order to use the latest features and advancements of these tools).

## Installation

```bash

npm i @piraces/eleventy-plugin-pwa

```

#### Add to eleventy config file

```js

const pluginPWA = require("@piraces/eleventy-plugin-pwa");

module.exports = function(eleventyConfig) {

  eleventyConfig.addPlugin(pluginPWA);

};

```

Read more about [Eleventy plugins](https://www.11ty.io/docs/plugins/)

#### Registering Service Worker

```html

// in your header templates

  if ("serviceWorker" in navigator)

    navigator.serviceWorker.register("/service-worker.js");

```

#### Adding Web App Manifest

Read [The Web App Manifest Guide](https://developers.google.com/web/fundamentals/web-app-manifest/)

## Options

You can also pass workbox generateSW options directly into the plugin.

For example :

```js

// overwriting destination file and more

const pluginPWA = require("@piraces/eleventy-plugin-pwa");

module.exports = function(eleventyConfig) {

  eleventyConfig.addPlugin(pluginPWA, {

    swDest: "./build/sw.js",

    globDirectory: "./build"

  });

};

```

Read more about it on [workbox generateSW module page](https://developers.google.com/web/tools/workbox/modules/workbox-build#full_generatesw_config)

## License

This code is available under the [MIT license](LICENSE).