diff --git a/README.md b/README.md index 9a518907..56150055 100644 --- a/README.md +++ b/README.md @@ -116,7 +116,7 @@ Allowed values are as follows |**[`inject`](#)**|`{Boolean\|String}`|`true`|`true \|\| 'head' \|\| 'body' \|\| false` Inject all assets into the given `template` or `templateContent`. When passing `true` or `'body'` all javascript resources will be placed at the bottom of the body element. `'head'` will place the scripts in the head element| |**[`favicon`](#)**|`{String}`|``|Adds the given favicon path to the output HTML| |**[`meta`](#)**|`{Object}`|`{}`|Allows to inject `meta`-tags. E.g. `meta: {viewport: 'width=device-width, initial-scale=1, shrink-to-fit=no'}`| -|**[`minify`](#)**|`{Boolean\|Object}`|`false`|Pass [html-minifier](https://github.com/kangax/html-minifier#options-quick-reference)'s options as object to minify the output| +|**[`minify`](#)**|`{Boolean\|Object}`|`true` if `mode` is `'production'`, otherwise `false`|Controls if and in what ways the output should be minified. See [minification](#minification) below for more details.| |**[`hash`](#)**|`{Boolean}`|`false`|If `true` then append a unique `webpack` compilation hash to all included scripts and CSS files. This is useful for cache busting| |**[`cache`](#)**|`{Boolean}`|`true`|Emit the file only if it was changed| |**[`showErrors`](#)**|`{Boolean}`|`true`|Errors details will be written into the HTML page| @@ -285,6 +285,26 @@ plugins: [ ] ``` +### Minification + +If the `minify` option is set to `true` (the default when webpack's `mode` is `'production'`), +the generated HTML will be minified using [html-minifier](https://github.com/kangax/html-minifier) +and the following options: + +```js +{ + collapseWhitespace: true, + removeComments: true, + removeRedundantAttributes: true, + removeScriptTypeAttributes: true, + removeStyleLinkTypeAttributes: true, + useShortDoctype: true +} +``` + +To use custom [html-minifier options](https://github.com/kangax/html-minifier#options-quick-reference) +pass an object to `minify` instead. This object will not be merged with the defaults above. + ### `Events` To allow other [plugins](https://github.com/webpack/docs/wiki/plugins) to alter the HTML this plugin executes diff --git a/examples/appcache/dist/webpack-4/manifest.appcache b/examples/appcache/dist/webpack-4/manifest.appcache index 49b02bec..0f3a560d 100644 --- a/examples/appcache/dist/webpack-4/manifest.appcache +++ b/examples/appcache/dist/webpack-4/manifest.appcache @@ -1,5 +1,5 @@ CACHE MANIFEST -# a351a7eb0665a7fa27b3 +# 83ab7029cec7797a5a8a 0714810ae3fb211173e2964249507195.png bundle.js diff --git a/examples/chunk-optimization/dist/webpack-4/entryA.html b/examples/chunk-optimization/dist/webpack-4/entryA.html index 0125c79b..00ab2b9e 100644 --- a/examples/chunk-optimization/dist/webpack-4/entryA.html +++ b/examples/chunk-optimization/dist/webpack-4/entryA.html @@ -1,9 +1 @@ - - - - - Webpack App - - - - \ No newline at end of file +Webpack App \ No newline at end of file diff --git a/examples/chunk-optimization/dist/webpack-4/entryB.html b/examples/chunk-optimization/dist/webpack-4/entryB.html index 7aa65260..1867dd39 100644 --- a/examples/chunk-optimization/dist/webpack-4/entryB.html +++ b/examples/chunk-optimization/dist/webpack-4/entryB.html @@ -1,9 +1 @@ - - - - - Webpack App - - - - \ No newline at end of file +Webpack App \ No newline at end of file diff --git a/examples/chunk-optimization/dist/webpack-4/entryC.html b/examples/chunk-optimization/dist/webpack-4/entryC.html index 6f986f9a..ae72852f 100644 --- a/examples/chunk-optimization/dist/webpack-4/entryC.html +++ b/examples/chunk-optimization/dist/webpack-4/entryC.html @@ -1,9 +1 @@ - - - - - Webpack App - - - - \ No newline at end of file +Webpack App \ No newline at end of file diff --git a/examples/custom-template/dist/webpack-4/index.html b/examples/custom-template/dist/webpack-4/index.html index 9a4b4918..104823b1 100644 --- a/examples/custom-template/dist/webpack-4/index.html +++ b/examples/custom-template/dist/webpack-4/index.html @@ -1,12 +1 @@ - - - - - Webpack App - - - -

Partial

- - - +Webpack App

Partial

\ No newline at end of file diff --git a/examples/default/dist/webpack-4/index.html b/examples/default/dist/webpack-4/index.html index 1d0b7be7..b0855186 100644 --- a/examples/default/dist/webpack-4/index.html +++ b/examples/default/dist/webpack-4/index.html @@ -1,9 +1 @@ - - - - - Webpack App - - - - \ No newline at end of file +Webpack App \ No newline at end of file diff --git a/examples/favicon/dist/webpack-4/favicon.html b/examples/favicon/dist/webpack-4/favicon.html index e7e0c7dd..3f61fb6d 100644 --- a/examples/favicon/dist/webpack-4/favicon.html +++ b/examples/favicon/dist/webpack-4/favicon.html @@ -1,9 +1 @@ - - - - - HtmlWebpackPlugin example - - - - \ No newline at end of file +HtmlWebpackPlugin example \ No newline at end of file diff --git a/examples/html-loader/dist/webpack-4/about.html b/examples/html-loader/dist/webpack-4/about.html index 5689f881..166bf3ed 100644 --- a/examples/html-loader/dist/webpack-4/about.html +++ b/examples/html-loader/dist/webpack-4/about.html @@ -1,11 +1 @@ - - - - - Example template - - - - - - \ No newline at end of file +Example template \ No newline at end of file diff --git a/examples/html-loader/dist/webpack-4/index.html b/examples/html-loader/dist/webpack-4/index.html index 5689f881..166bf3ed 100644 --- a/examples/html-loader/dist/webpack-4/index.html +++ b/examples/html-loader/dist/webpack-4/index.html @@ -1,11 +1 @@ - - - - - Example template - - - - - - \ No newline at end of file +Example template \ No newline at end of file diff --git a/examples/inline/dist/webpack-4/index.html b/examples/inline/dist/webpack-4/index.html index 99d2004e..0ec0b1ff 100644 --- a/examples/inline/dist/webpack-4/index.html +++ b/examples/inline/dist/webpack-4/index.html @@ -1,4 +1,4 @@ -pug demo \ No newline at end of file +Webpack AppHello World from backend -

Partial

\ No newline at end of file diff --git a/examples/javascript/dist/webpack-4/index.html b/examples/javascript/dist/webpack-4/index.html index fc2dba55..daac7ae4 100644 --- a/examples/javascript/dist/webpack-4/index.html +++ b/examples/javascript/dist/webpack-4/index.html @@ -1,2 +1 @@ -Hello World from backend2018-07-10T06:35:32.858Z

Partial

- \ No newline at end of file +Hello World from backend2018-09-15T20:52:24.239Z

Partial

\ No newline at end of file diff --git a/examples/pug-loader/dist/webpack-4/index.html b/examples/pug-loader/dist/webpack-4/index.html index 7deb41f2..8568a711 100644 --- a/examples/pug-loader/dist/webpack-4/index.html +++ b/examples/pug-loader/dist/webpack-4/index.html @@ -1 +1 @@ -pug demo
Current time

1998-12-31T23:00:00.000Z

\ No newline at end of file +pug demo
Current time

1999-01-01T00:00:00.000Z

\ No newline at end of file diff --git a/examples/sort-manually/dist/webpack-4/first-file.html b/examples/sort-manually/dist/webpack-4/first-file.html index b2d63a4f..f251a0f8 100644 --- a/examples/sort-manually/dist/webpack-4/first-file.html +++ b/examples/sort-manually/dist/webpack-4/first-file.html @@ -1,11 +1 @@ - - - - - Example template - - - - - - \ No newline at end of file +Example template \ No newline at end of file diff --git a/examples/sort-manually/dist/webpack-4/second-file.html b/examples/sort-manually/dist/webpack-4/second-file.html index 1ef7520f..ba8f8673 100644 --- a/examples/sort-manually/dist/webpack-4/second-file.html +++ b/examples/sort-manually/dist/webpack-4/second-file.html @@ -1,11 +1 @@ - - - - - Example template - - - - - - \ No newline at end of file +Example template \ No newline at end of file diff --git a/examples/template-parameters/dist/webpack-4/index.html b/examples/template-parameters/dist/webpack-4/index.html index ccf2967a..2ac7ecd2 100644 --- a/examples/template-parameters/dist/webpack-4/index.html +++ b/examples/template-parameters/dist/webpack-4/index.html @@ -1,9 +1 @@ - - - - - bar - - - - +bar \ No newline at end of file diff --git a/index.js b/index.js index bfee97f1..3c99b730 100644 --- a/index.js +++ b/index.js @@ -45,7 +45,7 @@ class HtmlWebpackPlugin { inject: true, compile: true, favicon: false, - minify: false, + minify: undefined, cache: true, showErrors: true, chunks: 'all', @@ -99,6 +99,23 @@ class HtmlWebpackPlugin { this.options.filename = path.relative(compiler.options.output.path, filename); } + // Check if webpack is running in production mode + // @see https://github.com/webpack/webpack/blob/3366421f1784c449f415cda5930a8e445086f688/lib/WebpackOptionsDefaulter.js#L12-L14 + const isProductionLikeMode = compiler.options.mode === 'production' || !compiler.options.mode; + + const minify = this.options.minify; + if (minify === true || (minify === undefined && isProductionLikeMode)) { + this.options.minify = { + // https://github.com/kangax/html-minifier#options-quick-reference + collapseWhitespace: true, + removeComments: true, + removeRedundantAttributes: true, + removeScriptTypeAttributes: true, + removeStyleLinkTypeAttributes: true, + useShortDoctype: true + }; + } + // Clear the cache once a new HtmlWebpackPlugin is added childCompiler.clearCache(compiler); @@ -410,7 +427,7 @@ class HtmlWebpackPlugin { ? this.injectAssetsIntoHtml(html, assets, assetTags) : html; const htmlAfterMinification = this.options.minify - ? require('html-minifier').minify(htmlAfterInjection, this.options.minify === true ? {} : this.options.minify) + ? require('html-minifier').minify(htmlAfterInjection, this.options.minify) : htmlAfterInjection; return Promise.resolve(htmlAfterMinification); } diff --git a/spec/basic.spec.js b/spec/basic.spec.js index 15a15765..1c74f1ef 100644 --- a/spec/basic.spec.js +++ b/spec/basic.spec.js @@ -332,7 +332,7 @@ describe('HtmlWebpackPlugin', () => { }, [{ type: 'chunkhash', chunkName: 'app', - containStr: ' + diff --git a/typings.d.ts b/typings.d.ts index 7d1890a2..e5fcef72 100644 --- a/typings.d.ts +++ b/typings.d.ts @@ -53,7 +53,7 @@ interface HtmlWebpackPluginOptions { * HTML Minification options * @https://github.com/kangax/html-minifier#options-quick-reference */ - minify: boolean | {}, + minify?: boolean | {}, cache: boolean, /** * Render errors into the HTML page