react-hot-loader may break the app in Webpack 5.0.0-beta.14 and up

wojtekmaj commented 4 years ago

Note: This has also been reported in Webpack repo.

Description

I'm getting an error "ReferenceError: exports is not defined" when running the application that uses with react-hot-loader and imports d3-array built with Wepack 5.0.0-beta.14 and up.

Expected behavior

"Uncaught ReferenceError: exports is not defined" not to be thrown when executing Webpack-bundled code.

Actual behavior

Here's the exact error:

Uncaught ReferenceError: exports is not defined
    at register (cross.js?0cbf:23)
    at eval (cross.js?0cbf:23)
    at Object.../node_modules/d3-array/src/cross.js (charts.js:376)
    at __webpack_require__ (src.js:6070)
    at fn (src.952fd4b1.js:6330)
    at eval (index.js:18)
    at Object.../node_modules/d3-array/src/index.js (charts.js:496)
    at __webpack_require__ (src.js:6070)
    at fn (src.js:6330)
    at eval (band.js:5)

Any of the following seem to unbreak the app:

removing d3-array import (duh)
export default hot(Root) -> export default Root
applying react-hot-loader/webpack loader to /node_modules\/react-dom/ only and not /node_modules/

Tested other versions of Webpack, changing absolutely nothing but the Webpack version, and here's my findings:

Version	Crashes?
4.43.0	✅ No
5.0.0-beta.12	✅ No
5.0.0-beta.13	✅ No
5.0.0-beta.14	❌ Yes
5.0.0-beta.16	❌ Yes

Environment

React Hot Loader version: 4.12.21

Run these commands in the project folder and fill in their results:

node -v: 12.16.2
npm -v: 6.14.4

Then, specify:

Operating system: macOS Catalina
Browser and version: Chrome 81.0.4044.129

Reproducible Demo

Reproducible repo

theKashey commented 4 years ago

applying react-hot-loader/webpack loader to /node_modules\/react-dom/ only

Is a good idea. There is no need to apply any "hot" stuff on the "static" node_modules

Additionally, you can pass noRegister option to webpack loader and it will skip the moment which is failing.

kahirokunn commented 3 years ago

Is there any progress?

theKashey commented 3 years ago

React-Hot-Loader is deprecated. There are newer variants based on FastRefresh compatible with wp5

kahirokunn commented 3 years ago

@theKashey I see. Thank you!

wojtekmaj commented 3 years ago

@kahirokunn And also instructions for this deprecated package were updated to keep people from falling into this trap, see https://github.com/gaearon/react-hot-loader/pull/1452.

whw583 commented 3 years ago

React-Hot-Loader is deprecated. There are newer variants based on FastRefresh compatible with wp5

https://github.com/pmmmwh/react-refresh-webpack-plugin

https://github.com/WebHotelier/webpack-fast-refresh

but not support react 15.

theKashey commented 3 years ago

Not sure why you use still React 15 (at least in dev mode). 16 is 100% backward compatible.

gaearon / react-hot-loader