Hot modules reloading mixes up module ids for some reason. The code I get in the bundle.js is the following:
// load the styles
var content = __webpack_require__(301);
if(typeof content === 'string') content = [[module.id, content, '']];
// add the styles to the DOM
var update = __webpack_require__(303)(content, {});
if(content.locals) module.exports = content.locals;
// Hot Module Replacement
if(true) {
// When the styles change, update the <style> tags
if(!content.locals) {
module.hot.accept(301301, function() {
var newContent = __webpack_require__(301);
Obviously I don't have 301301 modules. The issue gets much worse with config.output.pathinfo = true. The code becomes broken:
// bundle.js:10086 Uncaught SyntaxError: missing ) after argument list
module.hot.accept(/*! !./../css-loader!./angular-material.css */ 301/*! !./../css-loader!./angular-material.css */ 301, function() {
My command line to start is: node node_modules/.bin/webpack-dev-server --content-base app --hot --port 9090
A part of package.json:
"webpack": "1.13.1",
"webpack-dev-server": "1.14.1"
If any additional information is required please don't hesitate to ping me.
Don't use --hot and the HotModuleReplacmentPlugin.
@wips, did the above answer fix your problem?
@SpaceK33z, the code has been changed significantly since when I posted the issue. Unfortunately, I missed @sokra `s response on Jun 2. I need some time to reproduce the issue and try a fix. I will post here as soon as I have information.
Thanks guys, removing --hot has helped. Though is it very hard to find it out oneself.
@wips, this is documented in the docs, but I agree with you that it is still a bit too hard. I made #586 for this.
Most helpful comment
Don't use
--hotand theHotModuleReplacmentPlugin.