I’ve started experimenting with React and consequently Webpack. As a base I
picked Cory House’s excellent “Building Applications with React and Redux in ES6” course on Pluralsight (disclaimer: as a MS MVP I get free subscription). BTW Pluralsight is a really good learning content delivery – so much good stuff there.
Anyway, I was building upon Cory’s project and at some time I decided to update packages to their latest version (by updating versions in package.json, deleting node_modules and running npm update). Everything went smooth except that I noticed that debugging in browsers stopped for some reason. Breakpoints weren’t observed, sources weren’t shown. The later proved as hint what to look for – devtool settings in webpack.config.js that is.
It turns out that Cory was using cheap-module-eval-source-map which was working with the original version of webpack. However after updating it didn’t work anymore.
The solution is rather simple: add a new plugin to webpack.config.js:
new webpack.EvalSourceMapDevToolPlugin()
Looks like that folks at webpack decided to put this functionality into a separate plugin at a certain point in time (I didn’t follow its progress). And no, the solution isn’t mine. Instead I found it at this stackoverflow thread.
This is not exactly a fix—it's equivalent to overriding the `devtool` setting to a different (slower) mode.
The right fix was submitted in https://github.com/webpack/source-list-map/pull/2, and you can now update to Webpack 1.14.0 that includes it.