SyntaxError: Unexpected token 'export' when upgrading to 5.11.0

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Steps to reproduce 🕹

Link to live example:

Steps:

1. upgrade to mui 5.11.0
2. run jest test yarn test

Current behavior 😯

By default “node_modules” folder is ignored by transformers.

Here's what you can do:
 • If you are trying to use ECMAScript Modules, see https://jestjs.io/docs/ecmascript-modules for how to enable it.
 • If you are trying to use TypeScript, see https://jestjs.io/docs/getting-started#using-typescript
 • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
 • If you need a custom transformation specify a "transform" option in your config.
 • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/configuration
For information about custom transformations, see:
https://jestjs.io/docs/code-transformation

Details:

/Users/carlosagosto/projectName/node_modules/@mui/material/colors/common.js:5
export default common;
^^^^^^

SyntaxError: Unexpected token 'export'
> 2 | import common from '@mui/material/colors/common';

Expected behavior 🤔

Same as what was happening with version 5.10.17 jest test should pass because I am amazing! 😁

Context 🔦

Trying to get jest test to run with out have issue with the mui package. Look to be an issue with @mui/material/colors

Your environment 🌎

npx @mui/envinfo

  Don't forget to mention which browser you used.
  System:
    OS: macOS 13.0.1
  Binaries:
    Node: 16.15.1 - ~/.nvm/versions/node/v16.15.1/bin/node
    Yarn: 1.22.15 - /usr/local/bin/yarn
    npm: 8.11.0 - ~/.nvm/versions/node/v16.15.1/bin/npm
  Browsers:
    Chrome: 108.0.5359.98
    Edge: 108.0.1462.46
    Firefox: 103.0.2
    Safari: 16.1
  npmPackages:
    @emotion/react: ^11.10.5 => 11.10.5 
    @emotion/styled: ^11.10.5 => 11.10.5 
    @mui/base:  5.0.0-alpha.109 
    @mui/core-downloads-tracker:  5.10.17 
    @mui/icons-material: ^5.11.0 => 5.11.0 
    @mui/lab: ^5.0.0-alpha.112 => 5.0.0-alpha.112 
    @mui/material: ^5.10.17 => 5.10.17 
    @mui/private-theming:  5.10.16 
    @mui/styled-engine:  5.10.16 
    @mui/system:  5.10.17 
    @mui/types:  7.2.2 
    @mui/utils:  5.10.16 
    @mui/x-date-pickers: ^5.0.10 => 5.0.10 
    @types/react: ^18.0.26 => 18.0.26 
    react: ^18.2.0 => 18.2.0 
    react-dom: ^18.2.0 => 18.2.0 
    typescript: ^4.9.4 => 4.9.4 

[federico-ntr]

I don’t think this should be closed. It seems like you found a workaround, but the issue is still there, at least until it is stated somewhere that we should change the way we import stuff.

[adamsujeta]

Looks like I have a similar issue. On the version 5.10.17 I don’t have any problems.

error - .../node_modules/.pnpm/@mui+material@5.11.2_lskpmcsdi7ipu6qpuapyu56ihm/node_modules/@mui/material/Unstable_Grid2/Grid2.js:1
import PropTypes from 'prop-types';
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at Object.compileFunction (node:vm:360:18)
    at wrapSafe (node:internal/modules/cjs/loader:1088:15)
    at Module._compile (node:internal/modules/cjs/loader:1123:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1213:10)
    at Module.load (node:internal/modules/cjs/loader:1037:32)
    at Module._load (node:internal/modules/cjs/loader:878:12)
    at Module.require (node:internal/modules/cjs/loader:1061:19)
    at require (node:internal/modules/cjs/helpers:103:18)
    at @mui/material/Unstable_Grid2/Grid2