Version 3.x

.node-version

@@ -0,0 +1 @@
+4.3.2

.travis.yml

@@ -7,9 +7,11 @@ node_js:
   - "6"
 env:
   - WEBPACK=webpack
+before_install:
+  - stty columns 120
 install:
   - npm install --ignore-scripts
   - npm rm webpack
   - npm install $WEBPACK --ignore-scripts || true
 script:
-  - npm test
+  - npm test

CHANGELOG.md

@@ -1,6 +1,11 @@
 Change History
 ==============
 
+v3.x
+---
+* Rename `closingTag` into `voidTag` like in the official w3c spec.
+* Provide a `createHtmlTagObject` helper for plugin authors to create new tags.
+
 v2.26.0
 ---
 * Allow plugins to add attributes without values to the `<script>` and `<link>` tags

README.md

@@ -29,7 +29,11 @@ There are already some really powerful plugins which can be integrated with zero
  * [favicons-webpack-plugin](https://github.com/jantimon/favicons-webpack-plugin) which generates favicons and icons for iOS, Android and desktop browsers
  * [html-webpack-harddisk-plugin](https://github.com/jantimon/html-webpack-harddisk-plugin)
  * [html-webpack-inline-source-plugin](https://github.com/DustinJackson/html-webpack-inline-source-plugin) to inline your assets in the resulting HTML file
- * [html-webpack-exclude-assets-plugin](https://github.com/jamesjieye/html-webpack-exclude-assets-plugin) for excluding assets using regular expressions
+ * [html-webpack-exclude-assets-plugin](https://github.com/jamesjieye/html-webpack-exclude-assets-plugin) for excluding assets using regular expressions 
+ * [html-webpack-include-assets-plugin](https://github.com/jharris4/html-webpack-include-assets-plugin) for including lists of js or css file paths (such as those copied by the copy-webpack-plugin).
+ * [script-ext-html-webpack-plugin](https://github.com/numical/script-ext-html-webpack-plugin) to add `async`, `defer` or `module` attributes to your`<script>` elements, or even in-line them
+ * [style-ext-html-webpack-plugin](https://github.com/numical/style-ext-html-webpack-plugin) to convert your `<link>`s to external stylesheets into `<style>` elements containing internal CSS
+ * [resource-hints-webpack-plugin](https://github.com/jantimon/resource-hints-webpack-plugin) to add resource hints for faster initial page loads
 
 Basic Usage
 -----------
@@ -79,10 +83,9 @@ Allowed values are as follows:
 - `title`: The title to use for the generated HTML document.
 - `filename`: The file to write the HTML to. Defaults to `index.html`.
    You can specify a subdirectory here too (eg: `assets/admin.html`).
-- `template`: Webpack require path to the template. Please see the [docs](https://github.com/ampedandwired/html-webpack-plugin/blob/master/docs/template-option.md) for details. 
+- `template`: Webpack require path to the template. Please see the [docs](https://github.com/ampedandwired/html-webpack-plugin/blob/master/docs/template-option.md) for details.
 - `inject`: `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`: Adds the given favicon path to the output html.
-- `minify`: `{...} | false` Pass a [html-minifier](https://github.com/kangax/html-minifier#options-quick-reference) options object to minify the output.
 - `hash`: `true | false` if `true` then append a unique webpack compilation hash to all
   included scripts and CSS files. This is useful for cache busting.
 - `cache`: `true | false` if `true` (default) try to emit the file only if it was changed.
@@ -307,6 +310,7 @@ Note that the callback must be passed the htmlPluginData in order to pass this o
 
 You're free to contribute to this project by submitting [issues](https://github.com/ampedandwired/html-webpack-plugin/issues) and/or [pull requests](https://github.com/ampedandwired/html-webpack-plugin/pulls). This project is test-driven, so keep in mind that every change and new feature should be covered by tests.
 This project uses the [semistandard code style](https://github.com/Flet/semistandard).
+This plugin follows the webpack teams decision to support [node 4+](http://node.green/).
 
 # License
 

examples/appcache/dist/webpack-1/index.html

@@ -1 +1,11 @@
-<!doctype html><html lang="en" manifest="manifest.appcache"><head><meta charset="utf-8"><title>Example template</title><meta name="viewport" content="width=device-width,initial-scale=1"><link href="styles.css" rel="stylesheet"></head><body><img src="0714810ae3fb211173e2964249507195.png"><script type="text/javascript" src="bundle.js"></script></body></html>
+<!doctype html>
+<html lang="en" manifest="manifest.appcache">
+<head>
+  <meta charset="utf-8">
+  <title>Example template</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+<link href="styles.css" rel="stylesheet"></head>
+<body>
+  <img src="0714810ae3fb211173e2964249507195.png">
+<script type="text/javascript" src="bundle.js"></script></body>
+</html>

examples/appcache/dist/webpack-2/index.html

@@ -1 +1,11 @@
-<!doctype html><html lang="en" manifest="manifest.appcache"><head><meta charset="utf-8"><title>Example template</title><meta name="viewport" content="width=device-width,initial-scale=1"><link href="styles.css" rel="stylesheet"></head><body><img src="0714810ae3fb211173e2964249507195.png"><script type="text/javascript" src="bundle.js"></script></body></html>
+<!doctype html>
+<html lang="en" manifest="manifest.appcache">
+<head>
+  <meta charset="utf-8">
+  <title>Example template</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+<link href="styles.css" rel="stylesheet"></head>
+<body>
+  <img src="0714810ae3fb211173e2964249507195.png">
+<script type="text/javascript" src="bundle.js"></script></body>
+</html>

examples/appcache/webpack.config.js

@@ -22,11 +22,7 @@ module.exports = {
     new AppCachePlugin(),
     new HtmlWebpackPlugin({
       filename: 'index.html',
-      template: 'template.html',
-      minify: {
-        removeComments: true,
-        collapseWhitespace: true
-      }
+      template: 'template.html'
     }),
     new ExtractTextPlugin('styles.css')
   ]

index.js

@@ -7,6 +7,7 @@ var path = require('path');
 var childCompiler = require('./lib/compiler.js');
 var prettyError = require('./lib/errors.js');
 var chunkSorter = require('./lib/chunksorter.js');
+var htmlTag = require('./lib/html-tags.js');
 Promise.promisifyAll(fs);
 
 function HtmlWebpackPlugin (options) {
@@ -18,7 +19,6 @@ function HtmlWebpackPlugin (options) {
     inject: true,
     compile: true,
     favicon: false,
-    minify: false,
     cache: true,
     showErrors: true,
     chunks: 'all',
@@ -233,6 +233,9 @@ HtmlWebpackPlugin.prototype.evaluateCompilationResult = function (compilation, s
   } catch (e) {
     return Promise.reject(e);
   }
+  if (typeof newSource === 'object' && newSource.__esModule && newSource.default) {
+    newSource = newSource.default;
+  }
   return typeof newSource === 'string' || typeof newSource === 'function'
     ? Promise.resolve(newSource)
     : Promise.reject('The loader "' + this.options.template + '" didn\'t return html.');
@@ -286,14 +289,6 @@ HtmlWebpackPlugin.prototype.postProcessHtml = function (html, assets, assetTags)
       } else {
         return html;
       }
-    })
-    // Minify
-    .then(function (html) {
-      if (self.options.minify) {
-        var minify = require('html-minifier').minify;
-        return minify(html, self.options.minify);
-      }
-      return html;
     });
 };
 
@@ -466,42 +461,28 @@ HtmlWebpackPlugin.prototype.htmlWebpackPluginAssets = function (compilation, chu
 HtmlWebpackPlugin.prototype.generateAssetTags = function (assets) {
   // Turn script files into script tags
   var scripts = assets.js.map(function (scriptPath) {
-    return {
-      tagName: 'script',
-      closeTag: true,
-      attributes: {
-        type: 'text/javascript',
-        src: scriptPath
-      }
-    };
+    return htmlTag.createHtmlTagObject('script', {
+      type: 'text/javascript',
+      src: scriptPath
+    });
   });
-  // Make tags self-closing in case of xhtml
-  var selfClosingTag = !!this.options.xhtml;
   // Turn css files into link tags
   var styles = assets.css.map(function (stylePath) {
-    return {
-      tagName: 'link',
-      selfClosingTag: selfClosingTag,
-      attributes: {
-        href: stylePath,
-        rel: 'stylesheet'
-      }
-    };
+    return htmlTag.createHtmlTagObject('link', {
+      href: stylePath,
+      rel: 'stylesheet'
+    });
   });
   // Injection targets
   var head = [];
   var body = [];
 
   // If there is a favicon present, add it to the head
   if (assets.favicon) {
-    head.push({
-      tagName: 'link',
-      selfClosingTag: selfClosingTag,
-      attributes: {
-        rel: 'shortcut icon',
-        href: assets.favicon
-      }
-    });
+    head.push(htmlTag.createHtmlTagObject('link', {
+      rel: 'shortcut icon',
+      href: assets.favicon
+    }));
   }
   // Add styles to the head
   head = head.concat(styles);
@@ -521,8 +502,14 @@ HtmlWebpackPlugin.prototype.injectAssetsIntoHtml = function (html, assets, asset
   var htmlRegExp = /(<html[^>]*>)/i;
   var headRegExp = /(<\/head>)/i;
   var bodyRegExp = /(<\/body>)/i;
-  var body = assetTags.body.map(this.createHtmlTag);
-  var head = assetTags.head.map(this.createHtmlTag);
+  // Create the html strings for head
+  var head = assetTags.head.map(
+    (htmlTagObject) => htmlTag.htmlTagObjectToString(htmlTagObject, this.options.xhtml)
+  );
+  // Create the html strings for body
+  var body = assetTags.body.map(
+    (htmlTagObject) => htmlTag.htmlTagObjectToString(htmlTagObject, this.options.xhtml)
+  );
 
   if (body.length) {
     if (bodyRegExp.test(html)) {
@@ -577,25 +564,6 @@ HtmlWebpackPlugin.prototype.appendHash = function (url, hash) {
   return url + (url.indexOf('?') === -1 ? '?' : '&') + hash;
 };
 
-/**
- * Turn a tag definition into a html string
- */
-HtmlWebpackPlugin.prototype.createHtmlTag = function (tagDefinition) {
-  var attributes = Object.keys(tagDefinition.attributes || {})
-    .filter(function (attributeName) {
-      return tagDefinition.attributes[attributeName] !== false;
-    })
-    .map(function (attributeName) {
-      if (tagDefinition.attributes[attributeName] === true) {
-        return attributeName;
-      }
-      return attributeName + '="' + tagDefinition.attributes[attributeName] + '"';
-    });
-  return '<' + [tagDefinition.tagName].concat(attributes).join(' ') + (tagDefinition.selfClosingTag ? '/' : '') + '>' +
-    (tagDefinition.innerHTML || '') +
-    (tagDefinition.closeTag ? '</' + tagDefinition.tagName + '>' : '');
-};
-
 /**
  * Helper to return the absolute template path with a fallback loader
  */
@@ -606,7 +574,7 @@ HtmlWebpackPlugin.prototype.getFullTemplatePath = function (template, context) {
   }
   // Resolve template path
   return template.replace(
-    /([!])([^/\\][^!?]+|[^/\\!?])($|\?.+$)/,
+    /([!])([^/\\][^!?]+|[^/\\!?])($|\?[^!?\n]+$)/,
     function (match, prefix, filepath, postfix) {
       return prefix + path.resolve(filepath) + postfix;
     });

lib/html-tags.js

@@ -0,0 +1,44 @@
+/**
+ * This file helps to work with html tags as objects which are easy to modify
+ * and turn into a string
+ */
+
+/**
+ * Turn a tag definition into a html string
+ */
+function htmlTagObjectToString (tagDefinition, xhtml) {
+  var attributes = Object.keys(tagDefinition.attributes || {})
+    .filter(function (attributeName) {
+      return tagDefinition.attributes[attributeName] !== false;
+    })
+    .map(function (attributeName) {
+      if (tagDefinition.attributes[attributeName] === true) {
+        return xhtml ? attributeName + '="' + attributeName + '"' : attributeName;
+      }
+      return attributeName + '="' + tagDefinition.attributes[attributeName] + '"';
+    });
+  return '<' + [tagDefinition.tagName].concat(attributes).join(' ') + (tagDefinition.voidTag && xhtml ? '/' : '') + '>' +
+    (tagDefinition.innerHTML || '') +
+    (tagDefinition.voidTag ? '' : '</' + tagDefinition.tagName + '>');
+}
+
+/**
+ * Static helper to create a tag object to be get injected into the dom
+ *
+ * @param {String} tagName         - the name of the tage e.g. 'div'
+ * @param {Object} attributes      - tag attributes e.g. `{ 'class': 'example', disabled: true }`
+ */
+function createHtmlTagObject (tagName, attributes) {
+  // https://www.w3.org/TR/html5/syntax.html#void-elements
+  var voidTags = ['area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input', 'keygen', 'link', 'meta', 'param', 'source', 'track', 'wbr'];
+  return {
+    tagName: tagName,
+    voidTag: voidTags.indexOf(tagName) !== -1,
+    attributes: attributes
+  };
+}
+
+module.exports = {
+  createHtmlTagObject: createHtmlTagObject,
+  htmlTagObjectToString: htmlTagObjectToString
+};

package.json

@@ -56,7 +56,6 @@
   },
   "dependencies": {
     "bluebird": "^3.4.7",
-    "html-minifier": "^3.2.3",
     "loader-utils": "^0.2.16",
     "lodash": "^4.17.3",
     "pretty-error": "^2.0.2",