Redirect crash when used with Webpack HMR

[ghost]

Hi. I've come across the issue with using <Redirect /> alongside with HMR. The point is that, when HMR is set up and router has a redirect as a child, it prevents app from starting with following error:

    <Router>
      <Redirect from="/" to="/home" />
      <Home path="home" />
      <Auth path="auth"/>
      <NotFound default />
    </Router>

browser.js:34 Uncaught Error: <Router>: Children of <Router> must have a `path` or `default` prop, or be a `<Redirect>`. None found on element type `function Redirect(props) {
  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Location, null, function (locationContext) {
    return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(RedirectImpl, _extends({}, locationContext, props));
  });
}`
    at invariant (browser.js:34)
    at eval (index.js:617)
    at mapSingleChildIntoContext (react.development.js:921)
    at traverseAllChildrenImpl (react.development.js:791)
    at traverseAllChildrenImpl (react.development.js:807)
    at traverseAllChildren (react.development.js:864)
    at mapIntoWithKeyPrefixInternal (react.development.js:944)
    at Object.mapChildren [as map] (react.development.js:968)
    at ProxyComponent.render (index.js:273)

Here is a codesandbox with the complete code.

I've found out a workaround to make it work: all is needed is to replace from property with path:

// instead of this
<Redirect from="/" to="/home" />
// do this
<Redirect path="/" to="/home" />

In this case the condition here is evaluated to true, otherwise element.type === Redirect is false due to the way how, I think, HMR works in Webpack: element.type has a different reference from the Redirect inside library.

[ghost]

After some investigation I discovered probably a better solution here.

Instead of making a tricky workaround replacement of parameters it's better to mark all components from node_modules as "cold", whereas they are not supposed to be changed during development process anyway.

[ryanflorence]

Closing because I think the cold solution is correct. React Hot Loader is the source of the issue and also has a solution.

[pitops]

@tpolovyi I think this is still an issue if you work in a monorepo setup. Local packages are symlinked in node_modules. So if I understand it correctly then if I change a local package which is a dependency to my main project it won't be detected by RHL. Is that correct?