Skip to content

Watch breaks files outputted by CommonsChunkPlugin #770

@cowwoc

Description

@cowwoc

I am running across a bug where Webpack generates an invalid Javascript file when running in watch mode. This bug occurs 100% of the time, the first time I modify Cards.js in watch mode. Once the file is in a bad state, I keep on getting the following error:

 undefined is not a function
__webpack_require__@http://localhost:8080/com/realestate/frontend/page/Common.js:51:30
Object.webpackJsonp.0@http://localhost:8080/com/realestate/frontend/page/Cards.js:21:2
__webpack_require__@http://localhost:8080/com/realestate/frontend/page/Common.js:51:30
webpackJsonpCallback@http://localhost:8080/com/realestate/frontend/page/Common.js:22:20
(?)()@http://localhost:8080/com/realestate/frontend/page/Cards.js:1:1Common.js:1256 printUncaughtErrorCommon.js:1285 window.onerror
Common.js:51 Uncaught TypeError: undefined is not a function

The only way to fix the problem is to clean-build the entire project (further incremental changes to the file do not fix the problem).

Here is a copy of Common.js: https://gist.github.com/cowwoc/b752cf667c049af05cec
Here is a copy of Cards.js: https://gist.github.com/cowwoc/5cfcc58edc3b1a8aee40

I am modifying Cards.js line 54 over and over in order to trigger this problem.

I walked through the code and discovered that the browser hits line 51 with module[moduleId] equal to 29. This is problematic for two reasons:

  1. Usually module[moduleId] points to a function, not a number.
  2. Module 29 is generated by a call to require("./ResourceTable.scss"). If you look for it in Common.js you will notice it is not defined.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions