# @vxna/mini-html-webpack-template

> Minimum viable template for mini-html-webpack-plugin

Latest version **2.0.0** (published 2020-01-31) · MIT license · 0 weekly downloads

## Install

```sh
npm install @vxna/mini-html-webpack-template
pnpm add @vxna/mini-html-webpack-template
yarn add @vxna/mini-html-webpack-template
bun add @vxna/mini-html-webpack-template
```

## Health

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

Positive: has types package; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.0.0 |
| Published | 2020-01-31 |
| First published | 2018-03-14 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | separate (@types/vxna__mini-html-webpack-template) |
| Module format | CommonJS |
| Node | >= 10 |
| Dependencies | 1 |
| Unpacked size | 9.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 12 |
| Author | vxna |
| Maintainers | vxna |
| Keywords | webpack, mini-html-webpack-plugin |

## Links

- npm: https://www.npmjs.com/package/@vxna/mini-html-webpack-template
- Repository: https://github.com/vxna/mini-html-webpack-template
- Homepage: https://github.com/vxna/mini-html-webpack-template#readme
- Issues: https://github.com/vxna/mini-html-webpack-template/issues
- npm.io page: https://npm.io/package/@vxna/mini-html-webpack-template

## Dependencies (1)

- [common-tags](https://npm.io/package/common-tags.md) ^1.8.0

## Alternatives

- [@tsparticles/shape-image](https://npm.io/package/@tsparticles/shape-image.md) — 303.7K weekly downloads
- [@tsparticles/shape-line](https://npm.io/package/@tsparticles/shape-line.md) — 233.7K weekly downloads
- [stringify-attributes](https://npm.io/package/stringify-attributes.md) — 58.6K weekly downloads
- [mobile-drag-drop](https://npm.io/package/mobile-drag-drop.md) — 46.3K weekly downloads
- [@comunica/actor-rdf-parse-html](https://npm.io/package/@comunica/actor-rdf-parse-html.md) — 29.2K weekly downloads

## Recent versions

- 2.0.0 (latest) — 2020-01-31
- 1.0.0 — 2019-03-28
- 0.1.7 — 2018-05-10
- 0.1.6 — 2018-03-31
- 0.1.5 — 2018-03-30
- 0.1.4 — 2018-03-30
- 0.1.3 — 2018-03-30
- 0.1.2 — 2018-03-29
- 0.1.1 — 2018-03-29
- 0.1.0 — 2018-03-15
- 0.0.8 — 2018-03-15
- 0.0.7 — 2018-03-15
- 0.0.6 — 2018-03-15
- 0.0.5 — 2018-03-14
- 0.0.2 — 2018-03-14
- … 1 more at https://npm.io/package/@vxna/mini-html-webpack-template/versions

## README

# @vxna/mini-html-webpack-template

[![Build Status](https://travis-ci.com/vxna/mini-html-webpack-template.svg)](https://travis-ci.com/vxna/mini-html-webpack-template) [![npm](https://img.shields.io/npm/v/@vxna/mini-html-webpack-template.svg)](https://www.npmjs.com/package/@vxna/mini-html-webpack-template)

Template for [mini-html-webpack-plugin](https://github.com/bebraw/mini-html-webpack-plugin) that extends default features with useful subset of options

## Warning

It does not work with [html-webpack-plugin](https://github.com/jantimon/html-webpack-plugin)

## Common usage

**webpack.config.js**

```js
const MiniHtmlWebpackPlugin = require('mini-html-webpack-plugin')

module.exports = {
  plugins: [
    new MiniHtmlWebpackPlugin({
      context: {
        title: 'common-usage',
        favicon: 'https://assets-cdn.github.com/favicon.ico',
        container: 'root',
        trimWhitespace: true
      },
      template: require('@vxna/mini-html-webpack-template')
    })
  ]
}
```

## Common options

| Name                 | Type        | Default        | Description                        |
| -------------------- | ----------- | -------------- | ---------------------------------- |
| **`lang`**           | `{String}`  | `undefined`    | Set document language              |
| **`title`**          | `{String}`  | `'sample-app'` | Set document title                 |
| **`favicon`**        | `{String}`  | `undefined`    | Set document favicon               |
| **`container`**      | `{String}`  | `undefined`    | Set application mount point        |
| **`trimWhitespace`** | `{Boolean}` | `undefined`    | Safe document whitespace reduction |

## Extended usage

**webpack.config.js**

```js
const MiniHtmlWebpackPlugin = require('mini-html-webpack-plugin')

module.exports = {
  plugins: [
    new MiniHtmlWebpackPlugin({
      context: {
        title: 'extended-usage',
        head: {
          meta: [
            {
              name: 'description',
              content: 'mini-html-webpack-template'
            }
          ]
        },
        body: {
          raw: '<div id="root"></div>'
        },
        attrs: {
          js: {
            async: '',
            type: 'text/javascript'
          }
        }
      },
      template: require('@vxna/mini-html-webpack-template')
    })
  ]
}
```

## Extended options

| Name               | Type              | Default     | Description                               |
| ------------------ | ----------------- | ----------- | ----------------------------------------- |
| **`head.meta`**    | `{Array}`         | `undefined` | Array of objects with key + value pairs   |
| **`head.links`**   | `{Array}`         | `undefined` | Array of objects with key + value pairs   |
| **`head.scripts`** | `{Array}`         | `undefined` | Array of objects with key + value pairs   |
| **`head.raw`**     | `{Array\|String}` | `undefined` | Generates raw document markup             |
| **`body.scripts`** | `{Array}`         | `undefined` | Array of objects with key + value pairs   |
| **`body.raw`**     | `{Array\|String}` | `undefined` | Generates raw document markup             |
| **`attrs.js`**     | `{Object}`        | `undefined` | Applies html attributes to webpack output |
| **`attrs.css`**    | `{Object}`        | `undefined` | Applies html attributes to webpack output |

## Advanced minification

For custom needs [html-minifier](https://github.com/kangax/html-minifier) middleware and all of it's [options](https://github.com/kangax/html-minifier#options-quick-reference) could be used

**webpack.config.js**

```js
const { minify } = require('html-minifier')
const MiniHtmlWebpackPlugin = require('mini-html-webpack-plugin')

module.exports = {
  plugins: [
    new MiniHtmlWebpackPlugin({
      context: {
        title: 'advanced-minification'
      },
      template: ctx =>
        minify(require('@vxna/mini-html-webpack-template')(ctx), {
          collapseWhitespace: true,
          minifyCSS: true,
          minifyJS: true
        })
    })
  ]
}
```

## Complex security features

[SRI](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity) is out of scope of this project and it's recommended to use [html-webpack-plugin](https://github.com/jantimon/html-webpack-plugin) with it's ecosystem tools.

## Inspired by

[html-webpack-template](https://github.com/jaketrent/html-webpack-template)

## License

MIT (http://www.opensource.org/licenses/mit-license.php)

---
_Source: https://npm.io/package/@vxna/mini-html-webpack-template · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
