MaterialUI packages throwing error in SPFx solution
-
07-02-2021 - |
質問
Environment: SPFx with Office 365
I have created a SPFx solution with 1.8 as @microsoft/sharepoint version. I am trying to utilize material UI. so I have installed npm install @material-ui/core
into my SPFx solution. I have added references to my .tsx file as
import { createStyles, makeStyles } from '@material-ui/core/styles';
import Card from '@material-ui/core/Card';
import CardActions from '@material-ui/core/CardActions';
import CardContent from '@material-ui/core/CardContent';
import Button from '@material-ui/core/Button';
import Typography from '@material-ui/core/Typography';
In render method i just simple written as
return (
<div>
<Card></Card>
</div>
);
In browser console I am getting errors as below:
I thought because of materilUI has react version dependency i have updated them to latest. My package.json file looks below
Now I executed the gulp serve
where I am getting below is error in console
What is the resolution for this. I am trying to resolve this from 8hrs. I am not finding anyway. Please suggest me are there any dependencies that I need to install in the solution?
正しい解決策はありません
他のヒント
When using the SharePoint Framework to build react-based solutions, you must use the exact react version that ships with the version of SPFx you are using.
The main reason being that SharePoint and SPFx do many optimizations and want to avoid version conflicts on the page. It also helps them provide support.
SPFx version 1.8.2 ships with react 16.7.0 and react-dom 16.7.0.
The solution would be to install back the proper versions of react, react-dom and other dependencies you might have changed. Then install a version of material-ui that runs on react 16.7.0.