open-index/open-npm huggingface dataset:
npm package: @pwa/plugin-brotli
Description: > [`PWA`](https://pwa.cafe/) plugin for preparing compressed assets with [`brotli`](https://github.com/google/brotli)
Latest version: 0.5.0

# @pwa/plugin-brotli

> [`PWA`](https://pwa.cafe/) plugin for preparing compressed assets with [`brotli`](https://github.com/google/brotli)

## Install

```sh
$ npm install --save-dev @pwa/plugin-brotli
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_


## Config

Configurable via the `brotli` key on your `pwa.config.js` file.

***Default Config:***

```js
exports.brotli = {
  cache: true,
  threshold: 0,
  minRatio: 0.8,
  compressionOptions: {
    quality: 11,
    size_hint: 0,
    lgblock: 0,
    lgwin: 22,
    mode: 0
  }
}
```

***Available Options:***

See [Options](https://github.com/webpack-contrib/compression-webpack-plugin#options) for `compression-webpack-plugin`.

Also see [`iltorb`'s Encoding Params](https://github.com/MayhemYDG/iltorb#brotliencodeparams) for the `compressionOptions` object.

> :bulb: Explanations for the `brotli` parameters are available [here](https://github.com/google/brotli/blob/v1.0.4/c/include/brotli/encode.h#L133-L205).
npm package: @pwa/plugin-buble
Description: > [`PWA`](https://pwa.cafe/) plugin for [`Bublé`](https://buble.surge.sh/guide/#what-is-buble)
Latest version: 0.5.0

# @pwa/plugin-buble

> [`PWA`](https://pwa.cafe/) plugin for [`Bublé`](https://buble.surge.sh/guide/#what-is-buble)

## Install

```sh
$ npm install --save-dev @pwa/plugin-buble
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_

> **Important:** This plugin will automatically swap out & disable `babel-loader`!<br>
The use of Bublé is recommended for simpler, vanilla JS applications... and/or for [the wild and crazy](https://blog.chron.com/tubular/files/2014/02/wild-and-crazy-guys1.gif).


## Config

Configurable via the `buble` key on your `pwa.config.js` file.

> **Note:** Your [`Browserslist config`](https://github.com/lukeed/pwa#browserslist) results will be transformed into a `target` object for Bublé!<br>
However, defining your own `buble.target` object will prevent this transformation.

***Default Config:***

```js
exports.buble = {
  transforms: {
    modules: false
  }
}
```

***Available Options:***

See Bublé's documentation for [Supported Features](https://buble.surge.sh/guide/#supported-features), [JSX](https://buble.surge.sh/guide/#jsx), and [Dangerous Transforms](https://buble.surge.sh/guide/#dangerous-transforms).
npm package: @pwa/plugin-critters
Description: > [Critters](https://github.com/GoogleChromeLabs/critters) plugin for [`pwa`]()
Latest version: 0.5.0

# @pwa/plugin-critters

> [Critters](https://github.com/GoogleChromeLabs/critters) plugin for [`pwa`]()

## Install

```sh
$ npm install --save-dev @pwa/plugin-critters
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_

## Config

Configurable via the `critters` key on your `pwa.config.js` file.

***Default Config:***

_None – uses Critters' default config._

***Available Options:***

See [Critters Options](https://github.com/GoogleChromeLabs/critters#options).
npm package: @pwa/plugin-eslint
Description: > [`PWA`](https://pwa.cafe/) plugin for [ESLint](https://eslint.org/)
Latest version: 0.5.0

# @pwa/plugin-eslint

> [`PWA`](https://pwa.cafe/) plugin for [ESLint](https://eslint.org/)

## Install

```sh
$ npm install --save-dev @pwa/plugin-eslint eslint
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_

## Config

Configurable via the `eslint` key on your `pwa.config.js` file.

You may also define or use existing `.eslintrc.*` files in your project. You may also provide a custom `configFile` path.

***Default Config:***

```js
exports.eslint = {
  cache: true,
  parserOptions: {
    ecmaVersion: 10,
    parser: 'babel-eslint',
    sourceType: 'module',
  }
}
```

***Available Options:***

See [Options](https://github.com/webpack-contrib/eslint-loader#options) for `eslint-loader` and [ESLint's Options](https://eslint.org/docs/developer-guide/nodejs-api#cliengine) too.
npm package: @pwa/plugin-gzip
Description: > [`PWA`](https://pwa.cafe/) plugin for preparing compressed assets with `gzip`
Latest version: 0.5.0

# @pwa/plugin-gzip

> [`PWA`](https://pwa.cafe/) plugin for preparing compressed assets with `gzip`

## Install

```sh
$ npm install --save-dev @pwa/plugin-gzip
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_


## Config

Configurable via the `gzip` key on your `pwa.config.js` file.

***Default Config:***

```js
exports.gzip = {
  cache: true,
  threshold: 0,
  minRatio: 0.8,
  compressionOptions: {
    level: 9
  }
}
```

***Available Options:***

See [Options](https://github.com/webpack-contrib/compression-webpack-plugin#options) for `compression-webpack-plugin`.

Also see [`zlib` Options](https://nodejs.org/api/zlib.html#zlib_class_options) for the `compressionOptions` object.
npm package: @pwa/plugin-imagemin
Description: > [`PWA`](https://pwa.cafe/) plugin for to compress image assets
Latest version: 0.5.0

# @pwa/plugin-imagemin

> [`PWA`](https://pwa.cafe/) plugin for to compress image assets

## Install

```sh
$ npm install --save-dev @pwa/plugin-imagemin
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_

> **Note:** Disabled during development (aka, `pwa watch`)

## Config

Configurable via the `imagemin` key on your `pwa.config.js` file.

***Default Config:***

> **Note:** In addition to the below, inherits `imagemin-webpack-plugin` defaults.

```js
exports.imagemin = {
  test: /\.(svg|jpe?g|png|gif)$/i
}
```

***Available Options:***

See [`imagemin-webpack-plugin`](https://github.com/Klathmon/imagemin-webpack-plugin#api) for documentation.
npm package: @pwa/plugin-offline
Description: > [`PWA`](https://pwa.cafe/) plugin for [Offline Plugin](https://github.com/NekR/offline-plugin)
Latest version: 0.5.0

# @pwa/plugin-offline

> [`PWA`](https://pwa.cafe/) plugin for [Offline Plugin](https://github.com/NekR/offline-plugin)

## Install

```sh
$ npm install --save-dev @pwa/plugin-offline
```

## Usage

The plugin is recognized by and attached to `@pwa/core` automatically.

However, you must manually include Offline's runtime into your bundle!

```js
if (process.env.NODE_ENV === 'production') {
  if ('serviceWorker' in navigator) {
    require('offline-plugin/runtime').install();
  }
}
```

> **Note:** For SW beginners, it's strongly recommended you use the above snippet!<br>
However, it's not required to wrap registration in a `NODE_ENV === 'production'` check.

## Config

Configurable via the `offline` key on your `pwa.config.js` file.

***Default Config:***

```js
exports.offline = {
  externals: [],
  appShell: '/index.html',
  excludes: ['**/.*', '**/*.map', '**/*.gz', '**/*.gzip', '**/*.br'],
  ServiceWorker: {
    output: 'sw.js',
    events: true
  }
}
```

***Available Options:***

Please refer to Offline Plugin's [options](https://github.com/NekR/offline-plugin/blob/HEAD/docs/options.md) options.
npm package: @pwa/plugin-prettier
Description: > [`PWA`](https://pwa.cafe/) plugin for [Prettier](https://prettier.io/)
Latest version: 0.5.0

# @pwa/plugin-prettier

> [`PWA`](https://pwa.cafe/) plugin for [Prettier](https://prettier.io/)

## Install

```sh
$ npm install --save-dev @pwa/plugin-prettier prettier
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_

## Config

Configurable via the `prettier` key on your `pwa.config.js` file.

By default, Prettier's [configuration files](https://prettier.io/docs/en/configuration.html) are supported and applied automatically:

* `.prettierrc`
* `prettier.config.js`
* `package.json`'s `"prettier"` key
* `.prettierignore`

> **Note:** Prettier options passed to `pwa.config.js` directly will override config files' values.

***Default Config:***

```js
exports.prettier = {
  parser: 'babel'
}
```

***Available Options:***

See Prettier's [Options](https://prettier.io/docs/en/options.html)
npm package: @pwa/plugin-sw-precache
Description: > [`PWA`](https://pwa.cafe/) plugin for [SW Precache](https://github.com/GoogleChromeLabs/sw-precache)
Latest version: 0.5.0

# @pwa/plugin-sw-precache

> [`PWA`](https://pwa.cafe/) plugin for [SW Precache](https://github.com/GoogleChromeLabs/sw-precache)

## Install

```sh
$ npm install --save-dev @pwa/plugin-sw-precache
```

## Usage

The plugin is recognized by and attached to `@pwa/core` automatically.

However, you must manually include the generated `sw.js` file into your bundle!

```js
if (process.env.NODE_ENV === 'production') {
  if ('serviceWorker' in navigator) {
    navigator.serviceWorker.register('/sw.js');
  }
}
```

> **Note:** For SW beginners, it's strongly recommended you use the above snippet!<br>
However, it's not required to wrap registration in a `NODE_ENV === 'production'` check.


## Config

Configurable via the `precache` key on your `pwa.config.js` file.

***Default Config:***

```js
exports.precache = {
  minify: true,
  filename: 'sw.js',
  // stripPrefix: env.src
  navigateFallback: 'index.html',
  navigateFallbackWhitelist: [/^(?!\/__).*/],
  staticFileGlobsIgnorePatterns: [
    /\.git/,
    /\.DS_Store/,
    /^manifest.*\.js(?:on)?$/,
    /\.gz(ip)?$/,
    /\.map$/,
    /\.br$/
  ]
}
```

***Available Options:***

See [Options](https://github.com/goldhand/sw-precache-webpack-plugin#configuration) for `sw-precache-webpack-plugin`.
npm package: @pwa/plugin-sw-workbox
Description: > [`PWA`](https://pwa.cafe/) plugin for [Workbox SW](https://developers.google.com/web/tools/workbox/modules/workbox-sw)
Latest version: 0.5.0

# @pwa/plugin-sw-workbox

> [`PWA`](https://pwa.cafe/) plugin for [Workbox SW](https://developers.google.com/web/tools/workbox/modules/workbox-sw)

PWA runs Workbox in the `GenerateSW` mode by default.

If you'd like to use `InjectManifest` mode for more control, you must set either `advanced` or `injectManifest` to true.

> **Important:** With `InjectManiest`, you must also create a `service-worker.js` template file in your `src` directory.

***Further Reading***
* [Which Workbox mode should I use?](https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin#which_plugin_to_use)

## Install

```sh
$ npm install --save-dev @pwa/plugin-sw-workbox
```

## Usage

The plugin is recognized by and attached to `@pwa/core` automatically.

However, you must manually include the generated `sw.js` file into your bundle!

```js
if (process.env.NODE_ENV === 'production') {
  if ('serviceWorker' in navigator) {
    navigator.serviceWorker.register('/sw.js');
  }
}
```

> **Note:** For SW beginners, it's strongly recommended you use the above snippet!<br>
However, it's not required to wrap registration in a `NODE_ENV === 'production'` check.

## Config

Configurable via the `workbox` key on your `pwa.config.js` file.

***Default Config:***

```js
exports.workbox = {
  advanced: false, // alias
  injectManifest: false, // alias
  swSrc: 'service-worker.js', // template; mode: InjectManifest
  navigateFallbackWhitelist: [/^(?!\/__).*/], // mode: GenerateSW
  navigateFallback: 'index.html', // mode: GenerateSW
  swDest: 'sw.js',
  exclude: [
    /\.git/,
    /\.map$/,
    /\.DS_Store/,
    /^manifest.*\.js(?:on)?$/,
    /\.gz(ip)?$/,
    /\.br$/
  ]
}
```

***Available Options:***

If either `injectManifest` or `advanced` is set, please see [InjectManifest](https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin#full_injectmanifest_config) options.

Otherwise, please refer to the [GenerateSW](https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin#full_generatesw_config) options.
npm package: @pwa/plugin-typescript
Description: > [`PWA`](https://pwa.cafe/) plugin for [TypeScript](https://typescriptlang.org) **syntax** support!
Latest version: 0.5.0

# @pwa/plugin-typescript

> [`PWA`](https://pwa.cafe/) plugin for [TypeScript](https://typescriptlang.org) **syntax** support!

Installing this plugin allows your PWA toolchian to consume & understand TypeScript. This is done by:

* attaching [`@babel/preset-typescript`](https://babeljs.io/docs/en/babel-preset-typescript)
* altering webpack so that it recognizes the `.ts` and `.tsx` extensions
* altering `@pwa/plugin-prettier` and `@pwa/plugin-eslint` traverse TypeScript (if installed)
* running TypeScript type checks in a separate process

> **Important:** Your PWA application is still compiled by Babel!<br>This allows you to continue leveraging the existing Babel ecosystem.<br>This plugin enables you to **write** in TypeScript and yield its type-checking.

## Install

```sh
$ npm install --save-dev @pwa/plugin-typescript typescript
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_

## Config

Configurable via the `typescript` key on your `pwa.config.js` file.

Your configuration is passsed to [`@babel/preset-typescript`](https://babeljs.io/docs/en/babel-preset-typescript) directly!


> **Note:** Prettier options passed to `pwa.config.js` directly will override config files' values.

***Default Config:***

```js
exports.typescript = {
  allExtensions: true,
  isTSX: true,
}
```

***Available Options:***

See the [TypeScript Options](https://babeljs.io/docs/en/babel-preset-typescript#options) for the Babel preset.
npm package: @pwa/plugin-zopfli
Description: > [`PWA`](https://pwa.cafe/) plugin for preparing compressed assets with [`zopfli`](https://github.com/google/zopfli)
Latest version: 0.5.0

# @pwa/plugin-zopfli

> [`PWA`](https://pwa.cafe/) plugin for preparing compressed assets with [`zopfli`](https://github.com/google/zopfli)

## Install

```sh
$ npm install --save-dev @pwa/plugin-zopfli
```

> **Important:** Requires Node 8.x or above to work!

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_


## Config

Configurable via the `zopfli` key on your `pwa.config.js` file.

***Default Config:***

```js
exports.zopfli = {
  cache: true,
  threshold: 0,
  minRatio: 0.8,
  compressionOptions: {
    numiterations: 15
  }
}
```

***Available Options:***

See [Options](https://github.com/webpack-contrib/compression-webpack-plugin#options) for `compression-webpack-plugin`.

Also see [`universal-zopfli-js`'s Options](https://github.com/gfx/universal-zopfli-js#options) for the `compressionOptions` object.
npm package: @pwa/preset-preact
Description: > [Preact](https://preactjs.com/) preset for [`pwa`]()
Latest version: 0.5.0

# @pwa/preset-preact

> [Preact](https://preactjs.com/) preset for [`pwa`]()

## Install

> You must install Preact separately

```sh
$ npm install --save preact
$ npm install --save-dev @pwa/preset-preact
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_

## Config

_Takes no additional configuration._
npm package: @pwa/preset-react
Description: > [React](https://reactjs.org/) preset for [`pwa`]()
Latest version: 0.5.0

# @pwa/preset-react

> [React](https://reactjs.org/) preset for [`pwa`]()

## Install

> You must install React separately

```sh
$ npm install --save react react-dom
$ npm install --save-dev @pwa/preset-react
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_

## Config

_Takes no additional configuration._
npm package: @pwa/preset-svelte
Description: > [Svelte](https://svelte.technology/) preset for [`pwa`]()
Latest version: 0.5.0

# @pwa/preset-svelte

> [Svelte](https://svelte.technology/) preset for [`pwa`]()

## Install

> You must install Svelte separately

```sh
$ npm install --save-dev svelte @pwa/preset-svelte
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_

## Config

_Takes no additional configuration._
npm package: @pwa/preset-vue
Description: > [Vue](https://vuejs.org/) preset for [`pwa`]()
Latest version: 0.5.0

# @pwa/preset-vue

> [Vue](https://vuejs.org/) preset for [`pwa`]()

## Install

> You must install Vue separately

```sh
$ npm install --save vue
$ npm install --save-dev @pwa/preset-vue
```

## Usage

_None – recognized by and attached to `@pwa/core` automatically!_

## Config

_Takes no additional configuration._