Running codemod throws Error [ERR_REQUIRE_ESM]: require()

[Tiberriver256]

Duplicates

• [X] I have searched the existing issues

Latest version

• [X] I have tested the latest version

Current behavior 😯

Running npx @mui/codemod v5.0.0/preset-safe <path> as directed in the docs for migrating from v4 to v5 produces the following error:

Error [ERR_REQUIRE_ESM]: require() of ES Module C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\@babel\runtime\helpers\esm\toConsumableArray.js from C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\@mui\codemod\node\v5.0.0\adapter-v4.js not supported.
Instead change the require of toConsumableArray.js in C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\@mui\codemod\node\v5.0.0\adapter-v4.js to a dynamic import() which is available in all CommonJS modules.
    at Object.newLoader [as .js] (C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\pirates\lib\index.js:141:7)
    at Object.<anonymous> (C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\@mui\codemod\node\v5.0.0\adapter-v4.js:5:50)
    at Module._compile (C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\pirates\lib\index.js:136:24)
    at Object.newLoader [as .js] (C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\pirates\lib\index.js:141:7)
    at Object.<anonymous> (C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\@mui\codemod\node\v5.0.0\preset-safe.js:10:40)
    at Module._compile (C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\pirates\lib\index.js:136:24)
    at Object.newLoader [as .js] (C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\pirates\lib\index.js:141:7)
    at setup (C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\@mui\codemod\node_modules\jscodeshift\src\Worker.js:91:18)
    at Object.<anonymous> (C:\Users\mrairdon\AppData\Local\npm-cache\_npx\62df030d7e52d1d4\node_modules\@mui\codemod\node_modules\jscodeshift\src\Worker.js:45:3) {
  code: 'ERR_REQUIRE_ESM'
}

Expected behavior 🤔

The codemod should run

Steps to reproduce 🕹

Run the codemod command as directed in the documentation.

Context 🔦

Trying to follow the migration documentation

Your environment 🌎

`npx @mui/envinfo`

``` System: OS: Windows 10 10.0.19043 Binaries: Node: 16.13.1 - C:\Program Files\nodejs\node.EXE Yarn: Not Found npm: 8.1.2 - C:\Program Files\nodejs\npm.CMD Browsers: Chrome: 97.0.4692.71 Edge: Spartan (44.19041.1266.0), Chromium (97.0.1072.62) npmPackages: @emotion/react: 11.7.1 @emotion/styled: 11.6.0 @mui/base: 5.0.0-alpha.65 @mui/material: 5.3.0 @mui/private-theming: 5.3.0 @mui/styles: 5.3.0 @mui/types: 7.1.0 @mui/utils: 5.3.0 @mui/x-data-grid-pro: 4.0.2 @mui/x-license-pro: 4.0.2 @types/react: 17.0.38 react: 17.0.2 react-dom: 17.0.2 typescript: ^4.4.4 => 4.5.4 ```

[Tiberriver256]

I found a workaround. It seems to run fine making this change in my babel.config.json file

babel.config.json - unmodified

```json { "presets": [ "@babel/preset-env", [ "@babel/preset-react", { "runtime": "automatic" } ], "@babel/preset-typescript" ], "plugins": [ [ "@babel/plugin-transform-runtime", { "useESModules": true, "regenerator": false } ] ], "env": { "test": { "presets": [ [ "@babel/preset-env", { "targets": "current node" } ] ] } } } ```

[siriwatknp]

I think adding docs to clarify should be enough.