Issue with adding/removing hooks when runtimeChunk is true

[mmhand123]

When runtimeChunks: true is enabled in the webpack config, I'm running into an issue with getting Rendered more hooks than during the previous render. (or less, depending on what hooks get added/removed). To reproduce, add optimization: { runtimeChunks: true } to the webpack config of wds-kitchen-sink, and then add a hook to a functional component, save, and add another, The error should appear.

Edit - what I originally thought was incorrect 😦

[mmhand123]

Actually might not be the issue I thought it was. Getting the error to reproduce pretty much always when optimization.runtimeChunks is true. Will try to dig in more tomorrow.

[pmmmwh]

I think this might be related to #4

[mmhand123]

Ah yeah definitely. Sorry about opening the new issue, wasn't thinking 😅

At least in my config (and the wds-kitchen-sink when I added it) runtimeChunks: true was what was causing the errors to start occurring.

[drather19]

@mmhand123 thanks a lot for digging this up! I can confirm that setting runtimeChunks: false via craco in my CRA app fixes the issue I was having with adding/removing hooks in #4 earlier.

[pmmmwh]

I can confirm that this is reliably reproducible.

I think I also know the culprit, but this will take a bit of time to fix because it is related to how the plugin examine chunks to inject module initialization template conditionally. (createRefreshTemplate.js@L37)

It has to be conditional because some plugins, like the HTMLWebpackPlugin, also bundles html files as javascript/auto modules. If we did the transformation on all chunks passing through the plugin, it will screw up really badly.

[pmmmwh]

Fixed in v0.1.3 🎉

[mmhand123]

Thank you!!