Here is the content of my package.json file. Everything was working fine until recently when I started encountering this error.
"@material-ui/icons": "1.0.0-beta.42",
"chartist": "0.10.1",
"classnames": "2.2.5",
"material-ui": "1.0.0-beta.41",
"npm-run-all": "4.1.2",
"perfect-scrollbar": "1.3.0",
"react": "16.2.0",
"react-chartist": "0.13.1",
"react-dom": "16.2.0",
"react-google-maps": "9.4.5",
"react-router-dom": "4.2.2",
"react-scripts": "1.0.17",
"react-swipeable-views": "0.12.12"
This is how my component is structured: import React from "react"; import { withStyles, Card, CardHeader, CardContent, CardActions, Typography } from "material-ui"; import PropTypes from "prop-types";
import profileCardStyle from "assets/jss/material-dashboard-react/profileCardStyle";
function ProfileCard({ ...props }) {
const { classes, subtitle, title, description, footer, avatar } = props;
return (
<Card className={classes.card}>
<CardHeader
classes={{
root: classes.cardHeader,
avatar: classes.cardAvatar
}}
avatar={<img src={avatar} alt="..." className={classes.img} />}
/>
<CardContent className={classes.textAlign}>
{subtitle !== undefined ? (
<Typography component="h6" className={classes.cardSubtitle}>
{subtitle}
</Typography>
) : null}
{title !== undefined ? (
<Typography component="h4" className={classes.cardTitle}>
{title}
</Typography>
) : null}
{description !== undefined ? (
<Typography component="p" className={classes.cardDescription}>
{description}
</Typography>
) : null}
</CardContent>
<CardActions className={classes.textAlign + " " + classes.cardActions}>
{footer}
</CardActions>
</Card>
);
}
ProfileCard.propTypes = {
classes: PropTypes.object.isRequired,
title: PropTypes.node,
subtitle: PropTypes.node,
description: PropTypes.node,
footer: PropTypes.node,
avatar: PropTypes.string
};
export default withStyles(profileCardStyle)(ProfileCard);