I will have a look in some time. If you can, please share the repo so I can reproduce this quickly.

Sweet I used the code from this repo:

https://themes.material-ui.com/themes/paperbase/

https://github.com/mui-org/material-ui/tree/master/docs/src/pages/premium-themes/paperbase

While playing around again with the code I realised that after changing and saving a file the live reload / rebuild also seems to fix the issue. This is definitely something to do with the bundeler.

Have you found any solution so far? I'm facing the same problem while using material-ui with following babel config:
styled-components/babel-plugin-styled-components#78 (comment)

@futurfutur Can you share an example repro so I can debug this? The following "hello world" of material-ui works fine:

import React from 'react';
import Button from '@material-ui/core/Button';

const App = () => (
  <Button variant="contained" color="primary">
    Hello World
  </Button>
);

export default App

@asadm Thanks for your reply! Here's a project with Next and MUI
https://github.com/futurfutur/next-mui

After run ' yarn dev' app loads without errors, but on page refresh I've got following error:

Warning: Prop className did not match. Server: "MuiButtonBase-root MuiIconButton-root makeStyles-menuButton-928 makeStyles-hide-929 MuiIconButton-colorInherit MuiIconButton-edgeStart" Client: "MuiButtonBase-root MuiIconButton-root makeStyles-menuButton-7 makeStyles-hide-8 MuiIconButton-colorInherit MuiIconButton-edgeStart"

The problem's gone if I change import to dynamic import in _app.tsx (in that way SSR is disabled).