# sw-cache-plugin

> Webpack plugin that allows to cache generated assets in your own service worker.

Latest version **1.1.0** (published 2019-07-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install sw-cache-plugin
pnpm add sw-cache-plugin
yarn add sw-cache-plugin
bun add sw-cache-plugin
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.0 |
| Published | 2019-07-01 |
| First published | 2016-12-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >=5 |
| Dependencies | 11 |
| Unpacked size | 24.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 2 |
| Author | Hosarsiph Valle Hernandez |
| Maintainers | hosar |
| Keywords | caching, offline, precaching, service-worker, serviceworker, webpack, plugin, sw |

## Links

- npm: https://www.npmjs.com/package/sw-cache-plugin
- Repository: https://github.com/Hosar/sw-cache-plugin
- Homepage: https://github.com/Hosar/sw-cache-plugin#readme
- Issues: https://github.com/Hosar/sw-cache-plugin/issues
- npm.io page: https://npm.io/package/sw-cache-plugin

## Dependencies (11)

- [chalk](https://npm.io/package/chalk.md) ^1.1.3
- [debug](https://npm.io/package/debug.md) ^2.3.3
- [webpack](https://npm.io/package/webpack.md) ^4.16.5
- [bluebird](https://npm.io/package/bluebird.md) ^3.4.6
- [babel-core](https://npm.io/package/babel-core.md) ^7.0.0-bridge.0
- [@types/node](https://npm.io/package/@types/node.md) ^10.12.18
- [webpack-cli](https://npm.io/package/webpack-cli.md) ^3.1.0
- [@types/webpack](https://npm.io/package/@types/webpack.md) ^4.4.22
- [@types/bluebird](https://npm.io/package/@types/bluebird.md) ^3.5.25
- [lodash.defaults](https://npm.io/package/lodash.defaults.md) ^4.2.0
- [lodash.template](https://npm.io/package/lodash.template.md) ^4.4.0

## Alternatives

- [@openai/codex-sdk](https://npm.io/package/@openai/codex-sdk.md) — 731.4K weekly downloads
- [babel-plugin-transform-react-jsx](https://npm.io/package/babel-plugin-transform-react-jsx.md) — 565.0K weekly downloads
- [babel-helper-remove-or-void](https://npm.io/package/babel-helper-remove-or-void.md) — 508.5K weekly downloads
- [@pnpm/store-controller-types](https://npm.io/package/@pnpm/store-controller-types.md) — 186.9K weekly downloads
- [react-native-signature-canvas](https://npm.io/package/react-native-signature-canvas.md) — 155.6K weekly downloads

## Recent versions

- 1.1.0 (latest) — 2019-07-01
- 1.0.1 — 2018-08-13
- 1.0.0 — 2018-08-13
- 0.1.2 — 2016-12-09
- 0.1.1 — 2016-12-09
- 0.1.0 — 2016-12-09

## README

# sw-cache-plugin
[![CircleCI][circleci-img]][circleci-url]


Webpack plugin that allows to cache generated assets in your own service worker.


Description
-------
Inspired by @goldhand [SWPrecacheWebpackPlugin][sw-precache-webpack], for most all the cases [SWPrecacheWebpackPlugin][sw-precache-webpack] is the right choice. Use this plugin when you have your
**own** [service worker][0e425270] and you need to cache the Webpack generated assets which already include a versioning hash.

## Version 1.0.0
Includes support for Webpack 4.16.5

## Install
`npm install sw-cache-plugin --save-dev`

## Basic Usage
```
//webpack.config.js

const swCachePlugin = require('sw-cache-plugin');

plugins: [
    new swCachePlugin(
      {
        cacheName:'cacheName',
        ignore: [/.*\.map$/],
        include: ['/','/additional']
      }
    )
  ]
```
  This will generate an **AssetsManager.js** script file on your output path. Later in your sw.js file
import the script.
`importScripts('/dist/AssetsManager.js');`

Now you can use it to save the generated assets in the app cache as follow:

***sw.js***
```
importScripts('/dist/AssetsManager.js');
let assetsManager = new AssetsManager(); //create an instance of AssetsManager

//save the url-assets in cache
self.addEventListener('install', (event) => {
  event.waitUntil(assetsManager.addAllToCache());
});
```
Or remove:
```
self.addEventListener('activate', event => {
  event.waitUntil(assetsManager.removeNotInAssets());
});
```
## Configuration

**Plugin options:**
- `cacheName: [String]` name for your cache object.
- `ignore: [Array]` **regex** to avoid assets to be included in the cache entries.
- `include: [Array]` Additionals strings url to be included in the cache.

**Methods:**
- `addAllToCache()` add all webpack generated assets to browser app cache.
- `removeNotInAssets()` remove all current request that are in app cache, but not in the current
                        webpack generated assets.

**Properties:**
- `cacheEntries [Array]` contains an array with the url for all generated assets to be cached.
- `cacheName [String]` app cache name.

**Webpack dev server support:**
- add [write-file-webpack-plugin][69fb7c2c] to work with webpack dev server.


  [69fb7c2c]: https://github.com/gajus/write-file-webpack-plugin "write-file-plugin"


[sw-precache-webpack]: https://github.com/goldhand/sw-precache-webpack-plugin
[circleci-url]: https://circleci.com/gh/Hosar/sw-cache-plugin
[circleci-img]: https://circleci.com/gh/Hosar/sw-cache-plugin.svg?style=svg
  [0e425270]: https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers "sw-worker"

---
_Source: https://npm.io/package/sw-cache-plugin · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
