Uncaught Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's `render` method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner).

Uncaught Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's 'render' method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner).

This has been talked about; the answer: ‘don’t run two copies of React!’. I got it. Here’s the thing: I’m not running two copies of React. I’m building a React component npm module that is installed in a larger project. Within my module, I’m including React as a peer dependency and it’s marked as an external in my webpack.config.js. This has actually been working fine all the time, with one exception: when my components have refs.

I’ve gone so far as to use a document.querySelector() (yikes!) to get rid of that error message. There has to be a better way. I’m opening an issue now, though, because I want to use the react-widgets package and it uses refs. This is breaking my project.

Can’t React be smart enough to associate these refs with the running copy of React? Am I missing something?

Thanks

-Ben

[benwiley4000]

I’m fairly certain it’s a problem only with npm link, though I’m having trouble producing it on one of the two modules that were experiencing this error before, so there may have been compounding factors related to outdated node/npm versions. For now, consider that my module (react-component-x) relies on a peerDependency, react-widgets, which uses refs. My project, react-project-x requires react-component-x. When react-component-x is installed via npm link, the error above is displayed (I just tested this a moment ago). When I run npm unlink react-component-x inside of react-project-x and then install react-component-x from its remote git repository, the error goes away.

[benwiley4000]

Update: This issue has gone away for me. I’m not 100% sure what solved the problem, but I think it may be thanks to upgrading npm to v3.x and node to v4.x – and/or not using npm link.