this.namedChunks[source] undefined

[ylg]

First attempt at using indexhtml-webpack-plugin and am always seeing this error:

[redacted]/node_modules/indexhtml-webpack-plugin/index.js:13
var sourceModule = sourceChunk.origins[0].module;
                              ^

TypeError: Cannot read property 'origins' of undefined
    at Compilation.additionalChunkAssets ([redacted]/node_modules/indexhtml-webpack-plugin/index.js:13:47)
    at Compilation.applyPlugins ([redacted]/node_modules/webpack/node_modules/tapable/lib/Tapable.js:26:37)
    at Compilation.<anonymous> ([redacted]/node_modules/webpack/lib/Compilation.js:557:8)
    at Compilation.applyPluginsAsync ([redacted]/node_modules/webpack/node_modules/tapable/lib/Tapable.js:60:69)

I'm not familiar with the workings of plugins, I would have guessed that this:

entry:  {
  "index.html": "./index.html",

and this

plugins: [
  new IndexHtmlPlugin("index.html", "index.html")

need to match for that bit of code to work, but apparently that's not what is missing here. Thoughts?

[CtrlZvi]

@ylg Can you please post your full webpack config?

[squirmy]

I just got this when I had the path to my index.html wrong in the entry section. I guess the plugin gets invoked even in this invalid state and doesn't handle it too well.

[ylg]

Here's the webpack.config.js stripped way down (still has same error):

var IndexHtmlPlugin = require("indexhtml-webpack-plugin");

module.exports = {
  entry:  {
    "index.html": "./src/index.html"
  },

  module: {
    loaders: [
      {
        test: /index\.html$/,
        loader: "html"
      }
    ]
  },

  plugins: [
    new IndexHtmlPlugin("index.html", "index.html")
  ],

  output: {
    path: "./dist",
    filename: "index.html"
  }
};

Note I've tried a few million variations on index.html ./index.html ./src/index.html ../going-insane/index.html and so forth.

[ylg]

[email protected]
[email protected]
node v4.0.0

[squirmy]

are you sure that "./src/index.html" path is correct?
the only way i can reproduce the issue using your config above is if i change that to be incorrect.

my environment is the same, but using node v4.1.2

[ylg]

Thanks. Yes, I'm afraid ./src/index.html is correct. I've also tried moving index.html to the project's root and just using './index.html' and using the context option to set 'src', and just about every other pathing thing right and seemingly wrong I can think of.

I just bumped to Node 4.2.0 and see the same symptom.

[squirmy]

Ok. If you can provide a sample in a repository i'd be happy to have a look for you.

[sleepingevil]

@ylg I had the same problem, and it went away when I added the loader like this:

loader: 'html?attrs=link:href'

However I got a different error after fixing this:

C:\dev\acquisition\node_modules\indexhtml-webpack-plugin\IndexHtmlSource.js:73
    var filenamePattern = extractTextPlugin.filename
                                           ^

TypeError: Cannot read property 'filename' of undefined
    at getExtractedFilename (C:\dev\acquisition\node_modules\indexhtml-webpack-plugin\IndexHtmlSource.js:73:48)

I tracked the issue down and it looks like the following code in IndexHtmlSource.js is not able to find the ExtractTextPlugin:

var extractTextPlugin = _.find(compilation.compiler.options.plugins,
        function (p) {
            return (p.constructor.name === 'ExtractTextPlugin') &&
                ((typeof(p.id) === "undefined" && typeof(loaderId) === "undefined") || (p.id === loaderId));
        });

[nkronlage]

I was able to fix this by installing the 'html-loader' package:

npm install --save-dev html-loader

It'd be great if indexhtml-webpack-plugin gave a better error in this case. I found the solution by dumping 'this' inside the callback and seeing an error stored on 'this' with the real problem.

[nkronlage]

There's a complete demo of using indexhtml-webpack-plugin at:

https://github.com/nihey/webpack-single-page-boilerplate