Material-UIのMuiThemeProviderでcontextが設定されない。

Question

前提・実現したいこと

material-uiにて、themeの設定を行おうとしています。
MuiThemeProviderでコンポーネントをラップした際に、次のエラーが出ています。
解消方法を教えていただきたいです。

発生している問題・エラーメッセージ

コンポーネントにテーマが設定されません。
App内でcontextの値を確認すると何も入っていませんでした。

該当のソースコード

index.jsx

import React from 'react';
import { render } from 'react-dom';
import { MuiThemeProvider } from '@material-ui/core/styles';
import { theme } from './theme';
import App from './App';
console.log(theme);

render(
	<MuiThemeProvider theme={theme}>
	    <App />	
	</MuiThemeProvider>
	,
	window.document.getElementById('root')
);

App.jsx

import React, { Component } from 'react';
import { AppBar } from '@material-ui/core';

class App extends Component {
	constructor(props) {
		super(props);
	}

	render() {
		return (
			<div>
				<AppBar
					title="List"
					color='primary'		
				/>
			</div>
		);
	};
};

export default App;

theme.js

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

export const theme = createMuiTheme({
	palette: {
		primary: {
			main: '#FFF'
		},
		secondary: {
			main: '#2211FF'
		},
	},
});

試したこと

また、他のAppBarを他のコンポーネントに変更しても同様でした。

補足情報（FW/ツールのバージョンなど）

• @material-ui/core :3.9.2
• react: 16.8.6

Answer 1

@material-ui/core/AppBarではなくmaterial-ui/AppBarをimportしていた。
これにより古いバージョンのモジュールを読み込んでいた。