webpack-dev-server: HookWebpackError: Cannot read property 'updatedChunkIds' of undefined

Operating System: Windows
Node Version: 14.15.1
NPM Version: 6.14.10
webpack Version: 5.11.1
webpack-dev-server Version: 3.11.1
Browser: Chrome 87.0.4280.141

This is a bug
This is a modification request

Code

Expected Behavior

Live server compiles with hot: true and recompiles after editing code

Actual Behavior

If I run webpack via npm start it compiles, but if I change any piece of code (pug or scss or js) it fails with HookWebpackError: Cannot read property 'updatedChunkIds' of undefined

if I remove hot: true it works as expected;
if I remove target or pass browserlist instead of web - it still fails;
if I try to remove hot: true and init HMR via new webpack.HotModuleReplacementPlugin() - it fails in the same manner;

For Bugs; How can we reproduce the behavior?

My full build is on github (dev branch) - you can run it and check the bug;

About this issue

Original URL
State: closed
Created 3 years ago
Reactions: 2
Comments: 45 (18 by maintainers)

Most upvoted comments

@alexander-akait it’s the same repo from the start post. I’ve pushed package.json with updated dependencies (including webpack -> 5.17.0) to it.

I tried today the build with updated webpack, still have this issue from the start post

nat-davydova on Jan 26, 2021

Well, that’s the problem: I can’t find any pattern as to when this triggers, and I’ve never seen this trigger for small examples.

But: Given that this seems related to chunking, and inspired by the details given by @siilike, I read around in the docs:

non-initial is a chunk that may be lazy-loaded. It may appear when dynamic import or SplitChunksPlugin is being used.

I do not use SplitChunksPlugin, but I do use lazy loading. Wanna guess where the code I change to trigger this bug is located? Yep, it’s lazy-loaded, like so:

    "pseuco-testing": {
        title: "pseuCo – Testing",
        getComponent: async (): Promise<InteractiveComponent> => {
            return (await import('./pseucoTesting/pseuCoTesting')).default;
        }
    },

Thinking about it, I cannot recall fighting with this when changing code that is in the main, non-lazy-loaded part.

Does that help? I might try to create a minimal example again using lazy loading, but I’m not sure whether that’ll work.

fefrei on Apr 28, 2021

Started working after deleting records and making a clean build.

siilike on Mar 23, 2021

Are you still interested in seeing the problem happen on some code with an older version of Webpack, just to get some insurance on its origin and the fact it has been intentionally fixed?

It was complex bug and fixed here

avoid crash when experiments.lazyCompilation is used (regression) fix lazy compilation opt-out when HMR accept/decline is used on an import()

https://github.com/webpack/webpack/releases

Let’s close, anyway if somebody faced with the problem, please update webpack to v5.27.2, if it is not help, please open an issue with reproducible test repo

alexander-akait on Mar 23, 2021

Indeed 🙈 (I just wanted to link this up two-way, in case more relevant info appears on SO.)

fefrei on Feb 2, 2021

I’m getting a similar issue running Webpack 5.12.3

ℹ ｢wdm｣: Compiling...                                                                                                          │    at MiddlewareSequence.handle (/private/var/reliv/web/node_modules/@loopback/rest/src/sequence.ts:291:5)
✖ ｢wdm｣: HookWebpackError: Cannot read property 'updatedChunkIds' of undefined                                                 │    at HttpHandler._handleRequest (/private/var/reliv/web/node_modules/@loopback/rest/src/http-handler.ts:115:5) {
    at makeWebpackError (/private/var/reliv/web/node_modules/webpack/lib/HookWebpackError.js:49:9)                             │  message: 'Endpoint "GET /bower_components/tinymce/skins/lightgray/skin.min.css.map" not found.'
    at /private/var/reliv/web/node_modules/webpack/lib/Compilation.js:2198:11                                                  │}
    at eval (eval at create (/private/var/reliv/web/node_modules/webpack/node_modules/tapable/lib/HookCodeFactory.js:33:10), <a│
nonymous>:20:1)                                                                                                                │
    at fn (/private/var/reliv/web/node_modules/webpack/lib/Compilation.js:372:17)                                              │
    at Hook.eval [as callAsync] (eval at create (/private/var/reliv/web/node_modules/webpack/node_modules/tapable/lib/HookCodeF│
actory.js:33:10), <anonymous>:18:1)                                                                                            │
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/private/var/reliv/web/node_modules/webpack/node_modules/tapable/lib/Hook.js:1│
8:14)                                                                                                                          │
    at cont (/private/var/reliv/web/node_modules/webpack/lib/Compilation.js:2195:33)                                           │
    at /private/var/reliv/web/node_modules/webpack/lib/Compilation.js:2241:9                                                   │
    at /private/var/reliv/web/node_modules/webpack/node_modules/neo-async/async.js:2830:7                                      │
    at Object.each (/private/var/reliv/web/node_modules/webpack/node_modules/neo-async/async.js:2850:39)                       │
-- inner error --                                                                                                              │
TypeError: Cannot read property 'updatedChunkIds' of undefined                                                                 │
    at /private/var/reliv/web/node_modules/webpack/lib/HotModuleReplacementPlugin.js:605:11                                    │
    at exports.forEachRuntime (/private/var/reliv/web/node_modules/webpack/lib/util/runtime.js:61:3)                           │
    at /private/var/reliv/web/node_modules/webpack/lib/HotModuleReplacementPlugin.js:602:9                                     │
    at fn (/private/var/reliv/web/node_modules/webpack/lib/Compilation.js:370:10)                                              │
    at Hook.eval [as callAsync] (eval at create (/private/var/reliv/web/node_modules/webpack/node_modules/tapable/lib/HookCodeF│
actory.js:33:10), <anonymous>:18:1)                                                                                            │
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/private/var/reliv/web/node_modules/webpack/node_modules/tapable/lib/Hook.js:1│
8:14)                                                                                                                          │
    at cont (/private/var/reliv/web/node_modules/webpack/lib/Compilation.js:2195:33)                                           │
    at /private/var/reliv/web/node_modules/webpack/lib/Compilation.js:2241:9                                                   │
    at /private/var/reliv/web/node_modules/webpack/node_modules/neo-async/async.js:2830:7                                      │
    at Object.each (/private/var/reliv/web/node_modules/webpack/node_modules/neo-async/async.js:2850:39)                       │
✖ ｢wdm｣: caused by plugins in Compilation.hooks.processAssets                                                                  │
TypeError: Cannot read property 'updatedChunkIds' of undefined                                                                 │
    at /private/var/reliv/web/node_modules/webpack/lib/HotModuleReplacementPlugin.js:605:11                                    │
    at exports.forEachRuntime (/private/var/reliv/web/node_modules/webpack/lib/util/runtime.js:61:3)                           │
    at /private/var/reliv/web/node_modules/webpack/lib/HotModuleReplacementPlugin.js:602:9                                     │
    at fn (/private/var/reliv/web/node_modules/webpack/lib/Compilation.js:370:10)                                              │
    at Hook.eval [as callAsync] (eval at create (/private/var/reliv/web/node_modules/webpack/node_modules/tapable/lib/HookCodeF│
actory.js:33:10), <anonymous>:18:1)                                                                                            │
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/private/var/reliv/web/node_modules/webpack/node_modules/tapable/lib/Hook.js:1│
8:14)                                                                                                                          │
    at cont (/private/var/reliv/web/node_modules/webpack/lib/Compilation.js:2195:33)                                           │
    at /private/var/reliv/web/node_modules/webpack/lib/Compilation.js:2241:9                                                   │
    at /private/var/reliv/web/node_modules/webpack/node_modules/neo-async/async.js:2830:7                                      │
    at Object.each (/private/var/reliv/web/node_modules/webpack/node_modules/neo-async/async.js:2850:39)

bradharms on Jan 13, 2021

@alexander-akait I’ve added reproducible test repo in the start post, it is here - dev branch. Hope it’ll help.

I don’t know why the error exists, but everything fails only on HMR init =(

nat-davydova on Jan 11, 2021