Storing components by 'displayName' make wrapping unavailable about react-hot-loader HOT 18 CLOSED

I'd like to. Any ideas how to tell class A is still class A in next version of module? Ideally we'd also like to support dynamically generated classes inside function. I can't think of a way to do that now..

from react-hot-loader.

We can probably differentiate by call index (first createClass in module, second, etc) and disable hot reload for createClass calls after module definition (this will avoid problems with functions). Would you like to try?

from react-hot-loader.

I didn't read through all code yet, is it possible to simply check for an id property and create it if necessary?

from react-hot-loader.

Ah, I see now, your use case is createClass inside a function. Same as #24.

React does not support setting displayName property directly into wrapped component

Um, you're sure? I thought it worked.. Is it true for 0.11? So you can't do

  return React.createClass({
    displayName: displayName,

?

That's weird...

from react-hot-loader.

That's right, this problem is actual for 0.11. Same issue with Om: omcljs/om#124

from react-hot-loader.

OK, looking into that.

from react-hot-loader.

Why does this work for me?

http://jsbin.com/jaxezekeni/1/edit?html,js,output

/** @jsx React.DOM */

var wrap = function (displayName) {
  return React.createClass({
    displayName: displayName,
    render: function () {
      return <div>{displayName}</div>;
    }
  });
};

var A = wrap('yo');
var B = wrap('dawg');

var X = React.createClass({
  render: function () {
    return <div><A /><br /><B /></div>;
  }
});

React.renderComponent(<X />, document.body);

from react-hot-loader.

Maybe the problem is with transferPropsTo?

from react-hot-loader.

Your code works for me too. (Fixed fiddle to use displayName)

from react-hot-loader.

It's very strange. I'll investigate it more precisely.

from react-hot-loader.

Are you sure you have 0.11 locally?
Maybe you updated package.json but old dependency is still there.

Om comment is from February so it may not be relevant anymore..

from react-hot-loader.

Figured it out. React was loaded twice in a bundle. Thank you for help. I'm closing this issue.

from react-hot-loader.

Woah, that's quite a common problem actually. I wish React warned right away when this happens!

from react-hot-loader.

I'm having an issue with React being loaded twice, but I don't understand what's causing it to be loaded twice. Do you guys have any tips? I'm using the google-map-react library and this code:

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

Somehow seems to be loading an additional copy of react. Not even different versions! Why would Webpack ever load two copies of the same exact library? Seems like a bug to me

from react-hot-loader.

@jedwards1211 Those are not two Reacts, it's just the way Babel names variables.

from react-hot-loader.

@gaearon yes, I understood those aren't two Reacts. I think what was happening though was a second version of React was being loaded from google-map-react's own node_modules, even though its webpack bundle declares react as an external. I still haven't had time to get to the bottom of this issue

from react-hot-loader.

@jedwards1211 NPM doesn't care what Webpack says. If google-map-react's version of React declared as peerDependency is not compatible with the one in the outer project, NPM will install its own version of React inside there. That's the big problem with NPM 2, and it will be fixed in NPM 3.

from react-hot-loader.

Huh, it was compatible as far as I know, but that's good to know anyway. Thanks!

from react-hot-loader.