material-ui icon indicating copy to clipboard operation
material-ui copied to clipboard

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

Open lnmp4000 opened this issue 1 year ago • 2 comments

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

lnmp4000 avatar Mar 12 '24 14:03 lnmp4000

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.

StreetStrider avatar Mar 13 '24 23:03 StreetStrider

Please provide a minimal reproduction.

ZeeshanTamboli avatar Apr 29 '24 14:04 ZeeshanTamboli

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.

github-actions[bot] avatar May 07 '24 12:05 github-actions[bot]

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

juanpamm avatar May 17 '24 17:05 juanpamm

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

StreetStrider avatar May 17 '24 17:05 StreetStrider

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

  • @mui/material from version 5.15.17 to 5.15.7
  • @emotion/styled from version 11.11.5 to 11.11.0
  • @emotion/react from version 11.11.4 to 11.11.3

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

juanpamm avatar May 17 '24 17:05 juanpamm

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.

lnmp4000 avatar Jul 31 '24 16:07 lnmp4000