mui / material-ui

Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.
https://mui.com/material-ui/
MIT License
93.24k stars 32.11k forks source link

TypeError: (0 , _createTheme.default) is not a function #41464

Closed lnmp4000 closed 2 weeks ago

lnmp4000 commented 6 months ago

Steps to reproduce

Upgrade as follows leaves a working application unable to load.

                 "@ckeditor/ckeditor5-theme-lark": "^41.2.0",
                 "@ckeditor/ckeditor5-typing": "^41.2.0",
-                "@emotion/react": "^11.11.3",
+                "@emotion/react": "^11.11.4",
                 "@emotion/styled": "^11.11.0",
-                "@mui/icons-material": "^5.15.7",
-                "@mui/material": "^5.15.7",
-                "@mui/utils": "^5.15.7",
+                "@mui/icons-material": "^5.15.12",
+                "@mui/material": "^5.15.12",
+                "@mui/utils": "^5.15.12",
                 "@mui/x-date-pickers": "^6.19.2",
                 "@mui/x-tree-view": "^6.17.0",

The following code in the generated bundle fails

// Update /system/styled/#api in case if this changes
function shouldForwardProp(prop) {
  return prop !== 'ownerState' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';
}
const systemDefaultTheme = exports.systemDefaultTheme = (0, _createTheme.default)();
const lowercaseFirstLetter = string => {
  if (!string) {
    return string;
  }
  return string.charAt(0).toLowerCase() + string.slice(1);
};

with the error createStyled.js:41 Uncaught (in promise) TypeError: (0 , _createTheme.default) is not a function

Current behavior

The application fails with a script error on startup.

Expected behavior

The generated bundle should allow the application to startup.

Context

No response

Your environment

npx @mui/envinfo ``` System: OS: Linux 6.5 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish) Binaries: Node: 18.18.2 - ~/.nvm/versions/node/v18.18.2/bin/node npm: 10.5.0 - ~/.nvm/versions/node/v18.18.2/bin/npm pnpm: Not Found Browsers: Chrome: 122.0.6261.111 npmPackages: @emotion/react: 11.11.4 @emotion/styled: 11.11.0 @mui/base: 5.0.0-beta.38 @mui/core-downloads-tracker: 5.15.12 @mui/icons-material: 5.15.12 @mui/material: 5.15.12 @mui/private-theming: 5.15.12 @mui/styled-engine: 5.15.11 @mui/system: 5.15.12 @mui/types: 7.2.13 @mui/utils: 5.15.12 @mui/x-date-pickers: 6.19.2 @mui/x-tree-view: 6.17.0 @types/react: 18.2.65 react: 18.2.0 react-dom: 18.2.0 typescript: 5.3.3 ```

Search keywords: createTheme

StreetStrider commented 6 months ago

Hello. I've recently upgrated to 5.15.12 myself and also got my app broken. The error is similar: _styledEngine$1.internal_processStyles) is not a function. Hope, this can help.

I will try to override some of subdeps to bypass this.

While tracking this I've noted that doc says:

By default, @mui/material has @mui/styled-engine as a dependency.

But I can't see that to be the case. If someone could assist me with this issue and my findings that would be very nice.

ZeeshanTamboli commented 4 months ago

Please provide a minimal reproduction.

github-actions[bot] commented 4 months ago

Since the issue is missing key information and has been inactive for 7 days, it has been automatically closed. If you wish to see the issue reopened, please provide the missing information.

juanpamm commented 3 months ago

Have you found a way to solve this issue? I am currently facing this problem too.

StreetStrider commented 3 months ago

@juanpamm I've managed to fix my issue with this https://github.com/mui/material-ui/issues/33875#issuecomment-2063585831

juanpamm commented 3 months ago

@StreetStrider thanks for answering. I actually found a way to fix it (or so it seems). I had to downgrade:

I also removed ^ from the versions of those packages in the package.json.

lnmp4000 commented 1 month ago

I think I have got to the bottom of this now:

In my rollup config I had the @rollup/plugin-commonjs plugin with the configuration as follows:

commonjs({
    ignoreGlobal: true,
    requireReturnsDefault: 'auto'
})

it is specifically the requireReturnsDefault which is causing the issue. Setting this property to false resolves this bundling issue. I'm not sure of the implications of that setting at the moment, but a quick check through my app seems to have everything working now.

You can read more about the config options for that plugin here. git link

I hope this helps others who were experiencing this issue.