Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[1.3.beta4] can't use material-ui due to dual React Loading #6054

Closed
dagatsoin opened this issue Jan 21, 2016 · 3 comments
Closed

[1.3.beta4] can't use material-ui due to dual React Loading #6054

dagatsoin opened this issue Jan 21, 2016 · 3 comments

Comments

@dagatsoin
Copy link

NodeJS: v4.2.3
Npm: 2.14.14

Here is my package.json

{
  "dependencies": {
    "es6-promise": "^3.0.2",
    "material-ui": "^0.14.2",
    "react-dom": "^0.14.6", <---- installed by material-ui
    "react-redux": "4.0.6",
    "react-tap-event-plugin": "^0.2.1", <---- installed by material-ui
    "redux": "3.0.5",
    "redux-logger": "^2.3.2",
    "redux-simple-router": "1.0.2",
    "redux-thunk": "^1.0.3"
  },
  "devDependencies": {
    "deep-freeze": "0.0.1",
    "expect": "1.13.4",
    "redux-devtools": "3.0.1"
  }
}

Here is a test file:

import thunkMiddleware  from 'redux-thunk'
import createLogger  from 'redux-logger'
import { createStore, applyMiddleware } from 'redux'
import { Provider } from 'react-redux'
import { Map } from './components/Map.jsx'
import { rootReducer } from './reducers.js'
import { fetchObjects } from './map/actions'
import RaisedButton from 'material-ui/lib/raised-button';

Meteor.startup(function () {

  if (Meteor.isClient) {

    const loggerMiddleware = createLogger();

    const createStoreWithMiddleware = applyMiddleware(
      thunkMiddleware, // lets us dispatch() functions
      loggerMiddleware // neat middleware that logs actions
    )(createStore);

    const store = createStoreWithMiddleware(rootReducer);

    store.dispatch(fetchObjects());

  }
  ReactDOM.render(
    <RaisedButton label="Default" />,
    document.getElementById('render-target')
  );
});

And here is the error:

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.
@dagatsoin
Copy link
Author

EDIT: no way, even with material-ui@v0.14.1 which requires react@0.14.0 the error persists.

mui/material-ui#2818 (comment) says that it could be due to an older react version of the react packages for meteor. Indeed Material UI need react@0.14.16 and React Meteor package uses react@0.14.3_1.

Is it possible to upgrade the react version of meteor?

@dagatsoin
Copy link
Author

solved thanks to #5788 (comment)

@markshust
Copy link

Cool. I've also heard npm 2 might load React twice, so it's a good idea to use npm 3.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants