Error when running yarn start after yarn build: Named export 'ThemeProvider' not found

[ishchts]

You have already researched for similar issues?

Yes, I have searched for similar issues in the repository and could not find any that address this specific problem.

What are you trying to achieve, or the steps to reproduce?

I am trying to start my application after successfully building it, but the application fails to start due to an error related to the @mui/material/styles module.

Steps to reproduce:

1. Clone my repository: online-shop.
2. Run yarn install to install dependencies.
3. Run yarn build (completes successfully).
4. Run yarn start.
5. Observe the error.

// The error output
import { createTheme, ThemeProvider } from "@mui/material/styles/index.js";
                      ^^^^^^^^^^^^^
SyntaxError: Named export 'ThemeProvider' not found. The requested module '@mui/material/styles/index.js' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from '@mui/material/styles/index.js';
const { createTheme, ThemeProvider } = pkg;

What was the result you received?

The application failed to start, producing the error above.

What did you expect?

The application should start without errors after running yarn start.

Context

• node version: v20.10
• package manager: Yarn 4.5.3
• @mui/material version: 6.1.9
• os: MacOS Sonoma 14.4
• repository: online-shop
• any other relevant information: The issue might be related to the module format (CommonJS vs. ESModules). Adjusting the import statement or build configuration could potentially resolve the issue.

[jsumners]

How is this a Fastify issue?