react-dom patch can be broken when multiple version of react-hot-loader is installed

[otakustay]

If you are reporting a bug or having an issue setting up React Hot Loader, please fill in below. For feature requests, feel free to remove this template entirely.

Description

I'm encapsulating all webpack and babel configurations into a CLI tool so that react-hot-loader may be placed under my tools, however there is another react-hot-loader installed from other packages depending on this:

/my-app
    /node_modules
        /react-hot-loader # installed unexpectedly via other packages
        /my-cli-tool
            /node_modules
                /react-hot-loader # the actual one

Expected behavior

We expect everything works fine in such structure.

Actual behavior

When the actual react-hot-loader patches react-dom, it generates some error in runtime:

Uncaught TypeError: Cannot read property 'hasOwnProperty' of undefined
    at eval (react-dom.development.js?61bb:2392)
    at eval (react-dom.development.js?61bb:21321)
    at Object../node_modules/react-dom/cjs/react-dom.development.js (index.44497f310ddecdb84807.js:1942)
    at __webpack_require__ (index.44497f310ddecdb84807.js:724)
    at fn (index.44497f310ddecdb84807.js:101)
    at eval (index.js?8bc8:37)
    at Object../node_modules/react-dom/index.js (index.44497f310ddecdb84807.js:1954)
    at __webpack_require__ (index.44497f310ddecdb84807.js:724)
    at fn (index.44497f310ddecdb84807.js:101)
    at eval (react-hot-loader.development.js?fdf8:10)

To fix

The issue lies in webpackTagCommonJSExport.js, this file has a require('react-hot-loader') statement, however this is a generated code snippet inserted into other files, so this require call resolves to the one installed via other package.

I fixed it by mark it as require('%%REACT_HOT_LOADER_LOCATION%%') and replace this keyword from its webpack-loader by adding an extra .replace there

If this solution is acceptable, I'd like to send a pull request for this

[theKashey]

Known issue - React-hot-loader shall not patch react and react-hot-loader. Like Babel plugin is not doing.
A small fix.

Duplicate of #1209

[otakustay]

OK, if my fix is not the ideal one, I'll wait :)

[otakustay]

I tried to exclude react and react-hot-loader from loader's config, error still exists, it is possibly another issue?

[theKashey]

The issue is the same - stack track is the same (shellscape/webpack-plugin-serve#117)

react, react-hot-loader and react-dom. That would also disable hot-patch, but should work.

React-Hot-Loader got injected into react-dom, loads react-hot-loader and returns back to react-dom creating a cycle dependency.

Meanwhile, I let me try to fix it from webpack-loader side.

[theKashey]

• pin one react-hot-loader vresion using webpack aliases (or any other method)
• import react-hot-loader before React.

[eric-personal]

Anyone find an answer to this, i'm having the same issue.

[swatiwak]

How to solve this issue? Any workaround?

[theKashey]

The problem shall not exists, unless you create it. So - if problem is driven by webpack-loader - limit it only to the file it has intention to patch.

{
        test: /\.js$/,
        include: /node_modules\/react-dom/,
        use: ["react-hot-loader/webpack"],
},

Also just - try updating RHL