MUI 6.1 not working with PigmentCSS on NextJS

[Mike-Ro]

Steps to reproduce

Link to live example: https://github.com/Mike-Ro/test-muiv6.1

Steps:

1. cd current-project-root
2. npm install
3. npm run dev

Current behavior

Hi everyone!

I'm trying to run a simple project, but I keep getting an error, and the compilation just stops there:

$ npm run dev

> [email protected] dev
> next dev

  ▲ Next.js 14.2.14
  - Local:        http://localhost:3000

 ✓ Starting...
 ✓ Ready in 3.1s
TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received an instance of Object
    at Object.isAbsolute (node:path:407:5)
    at standardizeName (D:\_projects\code\front\test-muiv6.1\node_modules\@babel\core\lib\config\files\plugins.js:76:15)
    at resolveAlternativesHelper (D:\_projects\code\front\test-muiv6.1\node_modules\@babel\core\lib\config\files\plugins.js:81:28)
    at resolveAlternativesHelper.next (<anonymous>)
    at resolveStandardizedNameForRequire (D:\_projects\code\front\test-muiv6.1\node_modules\@babel\core\lib\config\files\plugins.js:159:16)
    at resolveStandardizedName (D:\_projects\code\front\test-muiv6.1\node_modules\@babel\core\lib\config\files\plugins.js:182:12)
    at D:\_projects\code\front\test-muiv6.1\node_modules\babel-merge\src\index.js:14:24
    at Array.find (<anonymous>)
    at D:\_projects\code\front\test-muiv6.1\node_modules\babel-merge\src\index.js:13:28
    at Array.reduce (<anonymous>)
    at mergeArray (D:\_projects\code\front\test-muiv6.1\node_modules\babel-merge\src\index.js:10:36)
    at babelMerge (D:\_projects\code\front\test-muiv6.1\node_modules\babel-merge\src\index.js:34:19)
    at merge (D:\_projects\code\front\test-muiv6.1\node_modules\@wyw-in-js\transform\lib\options\buildOptions.js:22:42)
    at Array.reduce (<anonymous>)
    at buildOptions (D:\_projects\code\front\test-muiv6.1\node_modules\@wyw-in-js\transform\lib\options\buildOptions.js:33:95)
    at buildConfigs (D:\_projects\code\front\test-muiv6.1\node_modules\@wyw-in-js\transform\lib\transform\Entrypoint.helpers.js:68:52)
    at Object.loadAndParse [as loadAndParseFn] (D:\_projects\code\front\test-muiv6.1\node_modules\@wyw-in-js\transform\lib\transform\Entrypoint.helpers.js:128:7)
    at new Entrypoint (D:\_projects\code\front\test-muiv6.1\node_modules\@wyw-in-js\transform\lib\transform\Entrypoint.js:40:112)
    at Entrypoint.innerCreate (D:\_projects\code\front\test-muiv6.1\node_modules\@wyw-in-js\transform\lib\transform\Entrypoint.js:129:27)
    at D:\_projects\code\front\test-muiv6.1\node_modules\@wyw-in-js\transform\lib\transform\Entrypoint.js:85:47
    at EventEmitter.perf (D:\_projects\code\front\test-muiv6.1\node_modules\@wyw-in-js\transform\lib\utils\EventEmitter.js:45:20)
    at Entrypoint.create (D:\_projects\code\front\test-muiv6.1\node_modules\@wyw-in-js\transform\lib\transform\Entrypoint.js:84:25)
    at Entrypoint.createRoot (D:\_projects\code\front\test-muiv6.1\node_modules\@wyw-in-js\transform\lib\transform\Entrypoint.js:62:32)
    at Object.transform (D:\_projects\code\front\test-muiv6.1\node_modules\@wyw-in-js\transform\lib\transform.js:98:45)
    at Object.transform (D:\_projects\code\front\test-muiv6.1\node_modules\@pigment-css\unplugin\build\index.js:268:40)
    at Object.transform (D:\_projects\code\front\test-muiv6.1\node_modules\unplugin\dist\webpack\loaders\transform.js:120:38)
    at LOADER_EXECUTION (D:\_projects\code\front\test-muiv6.1\node_modules\next\dist\compiled\loader-runner\LoaderRunner.js:1:4134)
    at runSyncOrAsync (D:\_projects\code\front\test-muiv6.1\node_modules\next\dist\compiled\loader-runner\LoaderRunner.js:1:4145)
    at iterateNormalLoaders (D:\_projects\code\front\test-muiv6.1\node_modules\next\dist\compiled\loader-runner\LoaderRunner.js:1:5782)
    at iterateNormalLoaders (D:\_projects\code\front\test-muiv6.1\node_modules\next\dist\compiled\loader-runner\LoaderRunner.js:1:5650)
    at D:\_projects\code\front\test-muiv6.1\node_modules\next\dist\compiled\loader-runner\LoaderRunner.js:1:5879
    at r.callback (D:\_projects\code\front\test-muiv6.1\node_modules\next\dist\compiled\loader-runner\LoaderRunner.js:1:4039)
    at Object.transform (D:\_projects\code\front\test-muiv6.1\node_modules\unplugin\dist\webpack\loaders\transform.js:135:5)
 ⨯ unhandledRejection: TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received an instance of Object
    at Object.isAbsolute (node:path:407:5)
    at standardizeName (D:\_projects\code\front\test-muiv6.1\node_modules\@babel\core\lib\config\files\plugins.js:76:15)
    at resolveAlternativesHelper (D:\_projects\code\front\test-muiv6.1\node_modules\@babel\core\lib\config\files\plugins.js:81:28)
    at resolveAlternativesHelper.next (<anonymous>)
    at resolveStandardizedNameForRequire (D:\_projects\code\front\test-muiv6.1\node_modules\@babel\core\lib\config\files\plugins.js:159:16)
    at resolveStandardizedName (D:\_projects\code\front\test-muiv6.1\node_modules\@babel\core\lib\config\files\plugins.js:182:12)
    at D:\_projects\code\front\test-muiv6.1\node_modules\babel-merge\src\index.js:14:24
...

Expected behavior

No response

Context

No response

Your environment

No response

Search keywords: nextjs, pigmentcss

[nunesunil]

#43971 (comment)

[Mike-Ro]

#43971 (comment)

It worked for me:

npm uninstall @babel/core
npm install @babel/[email protected]
npm dedupe

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

Note

We value your feedback @Mike-Ro! How was your experience with our support team?
We'd love to hear your thoughts in this brief Support Satisfaction survey. Your insights help us improve!

[Janpot]

Duplicate of #43971