Module not found: Can't resolve 'material-ui/styles/colors'

Question

I have the following code, that does not compiled:

import React from 'react';
import { AppBar, Toolbar } from 'material-ui';
import { Typography } from 'material-ui';
import { MuiThemeProvider, createMuiTheme } from 'material-ui/styles';
import {cyan, red} from 'material-ui/colors';
import { red400 } from 'material-ui/styles/colors';


const theme = createMuiTheme({
  palette: {
    primary: red400,
    secondary: cyan, 
  },
});

const View = (props) => (
  <MuiThemeProvider theme={theme}>
    <AppBar position="static">
      <Toolbar>
      <Typography variant="title">
        {props.title}
      </Typography>          
      </Toolbar>
    </AppBar>
  </MuiThemeProvider>
);
export default View;

It says:

Failed to compile
./src/Dashboard/AppBar/Views/View.js
Module not found: Can't resolve 'material-ui/styles/colors' in '/home/developer/Desktop/react-reason/example/src/Dashboard/AppBar/Views'  

What am I doing wrong?

Answer 1

try this instead

import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles';

Answer 2

In my case i downloaded a template Material Dashboard Pro and was running npm install to install the dependencies but it was showing the same error so i fixed it with

npm install material-ui@next --force

by adding --force flag solved my issue. posting this because it may be helpful for someone.