Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – NPM package compatibility issue with Material UI Core, React-IS and material-ui-color

I am using React 17.0.2 and Material UI v^5. I want to use the material-ui-color package which does not seem to be compatible with React 18, so I downgraded to React 17. The material-ui-color package ALSO seems to require @material-ui/core v^4.11.2.

Here is the npm page of material-ui-color that specifies it’s requirements:

    "@material-ui/core": "^4.11.2",
    "material-ui-popup-state": "^1.7.1",
    "prop-types": "^15.7.2",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",

So this is my current package.json:

    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-router-dom": "^6.23.0",
    "@mui/material-v5": "npm:@mui/[email protected]",
    "@material-ui/core": "^4.11.2",
    "material-ui-color": "^1.2.0",
    "material-ui-popup-state": "^1.7.1",
    "prop-types": "^15.7.2"
    "@emotion/react": "^11.11.4",
    "@emotion/styled": "^11.11.5",
    "@faker-js/faker": "^8.4.1",
    "@mui/icons-material": "^5.15.19",

The problem now is when I import the ColorPicker component from material-ui-color and use it in my app, I get an error in the browser:

Uncaught SyntaxError: The requested module ‘/node_modules/react-is/index.js?v=39eb481b’ does not provide an export named ‘ForwardRef’ (at getDisplayName.js?v=39eb481b:2:10)

The error is thrown by an import of ForwardRef in the @material-ui/core node module (v4.12.4) from react-is v17.0.2.

How do I fix this issue?

I would like to use material-ui-color in my app.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I ended up using a different color picker package (mui-color-input) which is compatible with React 18 as well as Material 5.


  2. 0 
    "@material-ui/core": "^4.12.4",
"@mui/icons-material": "^5.15.7",
"@mui/lab": "^5.0.0-alpha.109",
"@mui/material": "^5.10.15",
"@mui/system": "^5.10.15",
"@mui/x-data-grid": "^5.17.13",
"@mui/x-date-pickers": "^5.0.20",

    Please update node version to 18.19.0
    And use above Material UI versions.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search