Cleaner chunks api

README.md

@@ -154,7 +154,7 @@ plugins: [
 ]
 ```
 
-The `templateContent` option can also be a function:
+The `templateContent` option can also be a function to use another template language like jade:
 ```javascript
 plugins: [
   new HtmlWebpackPlugin({
@@ -206,3 +206,28 @@ template is rendered. This variable has the following attributes:
 
 - `webpackConfig`: the webpack configuration that was used for this compilation. This
   can be used, for example, to get the `publicPath` (`webpackConfig.output.publicPath`).
+
+
+Filtering chunks
+----------------
+
+To include only certain chunks you can limit the chunks beeing used:
+
+```javascript
+plugins: [
+  new HtmlWebpackPlugin({
+    chunks: ['app']
+  })
+]
+```
+
+It is also possible to exclude certain chunks by setting the `excludeChunks` option:
+
+```javascript
+plugins: [
+  new HtmlWebpackPlugin({
+    excludeChunks: ['dev-helper']
+  })
+]
+```
+

index.js

@@ -16,7 +16,7 @@ HtmlWebpackPlugin.prototype.apply = function(compiler) {
     templateParams.webpack = webpackStatsJson;
     templateParams.htmlWebpackPlugin = {};
     templateParams.htmlWebpackPlugin.assets = self.htmlWebpackPluginLegacyAssets(compilation, webpackStatsJson);
-    templateParams.htmlWebpackPlugin.files = self.htmlWebpackPluginAssets(compilation, webpackStatsJson, self.options.hash);
+    templateParams.htmlWebpackPlugin.files = self.htmlWebpackPluginAssets(compilation, webpackStatsJson, self.options.chunks, self.options.excludeChunks);
     templateParams.htmlWebpackPlugin.options = self.options;
     templateParams.webpackConfig = compilation.options;
 
@@ -58,7 +58,7 @@ HtmlWebpackPlugin.prototype.emitHtml = function(compilation, htmlTemplateContent
   }
   // Inject link and script elements into an existing html file
   if (this.options.inject) {
-    html = this.injectAssetsIntoHtml(html, templateParams, this.options.inject);
+    html = this.injectAssetsIntoHtml(html, templateParams);
   }
   compilation.assets[outputFilename] = {
     source: function() {
@@ -71,9 +71,8 @@ HtmlWebpackPlugin.prototype.emitHtml = function(compilation, htmlTemplateContent
 };
 
 
-HtmlWebpackPlugin.prototype.htmlWebpackPluginAssets = function(compilation, webpackStatsJson, appendHash) {
+HtmlWebpackPlugin.prototype.htmlWebpackPluginAssets = function(compilation, webpackStatsJson, includedChunks, excludedChunks) {
   var publicPath = compilation.options.output.publicPath || '';
-  var queryString = appendHash ? '?' + webpackStatsJson.hash : '';
 
   var assets = {
     // Will contain all js & css files by chunk
@@ -85,8 +84,6 @@ HtmlWebpackPlugin.prototype.htmlWebpackPluginAssets = function(compilation, webp
     // Will contain the html5 appcache manifest files if it exists
     manifest: Object.keys(compilation.assets).filter(function(assetFile){
       return path.extname(assetFile) === '.appcache';
-    }).map(function(assetFile) {
-      return assetFile + queryString;
     })[0]
   };
 
@@ -101,11 +98,21 @@ HtmlWebpackPlugin.prototype.htmlWebpackPluginAssets = function(compilation, webp
   for (var i = 0; i < chunks.length; i++) {
     var chunk = chunks[i];
     var chunkName = chunk.names[0];
+
+    // Skip if the chunks should be filtered and the given chunk was not added explicity
+    if (Array.isArray(includedChunks) && includedChunks.indexOf(chunkName) === -1) {
+      continue;
+    }
+    // Skip if the chunks should be filtered and the given chunk was excluded explicity
+    if (Array.isArray(excludedChunks) && excludedChunks.indexOf(chunkName) !== -1) {
+      continue;
+    }
+
     assets.chunks[chunkName] = {};
 
     // Prepend the public path to all chunk files
-    var chunkFiles = [].concat(chunk.files).map(function(chunkFile) {
-      return publicPath + chunkFile + queryString;
+    var chunkFiles = [].concat(webpackStatsJson.assetsByChunkName[chunkName]).map(function(chunkFile) {
+      return publicPath + chunkFile;
     });
 
     // Append a hash for cache busting
@@ -141,12 +148,10 @@ HtmlWebpackPlugin.prototype.htmlWebpackPluginAssets = function(compilation, webp
 /**
  * Injects the assets into the given html string
  */
-HtmlWebpackPlugin.prototype.injectAssetsIntoHtml = function(html, templateParams, chunks) {
+HtmlWebpackPlugin.prototype.injectAssetsIntoHtml = function(html, templateParams) {
   var assets = templateParams.htmlWebpackPlugin.files;
-  // If chunks is set to true inject all chunks
-  if (chunks === true) {
-    chunks = Object.keys(assets.chunks);
-  }
+  var chunks = Object.keys(assets.chunks);
+
   // Gather all css and script files
   var styles = [];
   var scripts = [];

spec/HtmlWebpackPluginSpec.js

@@ -113,7 +113,8 @@ describe('HtmlWebpackPlugin', function() {
         filename: '[name]_bundle.js'
       },
       plugins: [new HtmlWebpackPlugin({
-        inject: ['util', 'app'],
+        inject: true,
+        chunks: ['util', 'app'],
         templateContent: fs.readFileSync(path.join(__dirname, 'fixtures/plain.html'), 'utf8')
       })]
     }, ['<script src="util_bundle.js"', '<script src="app_bundle.js"'], null, done);
@@ -130,7 +131,26 @@ describe('HtmlWebpackPlugin', function() {
         filename: '[name]_bundle.js'
       },
       plugins: [new HtmlWebpackPlugin({
-        inject: ['app'],
+        inject: true,
+        chunks: ['app'],
+        template: path.join(__dirname, 'fixtures/plain.html')
+      })]
+    }, ['<script src="app_bundle.js"'], null, done);
+  });
+
+  it('allows you to inject a specified asset into a given html file', function (done) {
+    testHtmlPlugin({
+      entry: {
+        util: path.join(__dirname, 'fixtures/util.js'),
+        app: path.join(__dirname, 'fixtures/index.js')
+      },
+      output: {
+        path: OUTPUT_DIR,
+        filename: '[name]_bundle.js'
+      },
+      plugins: [new HtmlWebpackPlugin({
+        inject: true,
+        excludeChunks: ['util'],
         template: path.join(__dirname, 'fixtures/plain.html')
       })]
     }, ['<script src="app_bundle.js"'], null, done);