material-ui: Build error upgrading from 5.0.0-alpha.20 to 5.0.0-alpha.21

When this going to solve?

@usama-asfar As soon as we make a new release. Maybe tomorrow so that developers coming back from holidays can have a working environment with the latest changes.

Would the following be enough for fixing it in the next time we release it from a Windows machine?

diff --git a/scripts/copy-files.js b/scripts/copy-files.js
index 146adead04..229b21d7da 100644
--- a/scripts/copy-files.js
+++ b/scripts/copy-files.js
@@ -31,7 +31,7 @@ async function createModulePackages({ from, to }) {
       const packageJson = {
         sideEffects: false,
         module: './index.js',
-        main: path.join('../node', directoryPackage, 'index.js'),
+        main: `../node/${directoryPackage}/index.js`,
         types: './index.d.ts',
       };

In anycase, we round-robin releases, the next release (v5.0.0-alpha.22) won’t happen from a Windows machine, but we still need to fix it for the next time.

@flpvsk Perfect, thanks for the reproduction. I took some time to explore it further (~10 minutes), especially making it as dead simple as possible while still reproducing the issue. I have found one problem, that might be enough to fix.

{
 "sideEffects": false,
 "module": "./index.js",
 "main": "../node/styles/index.js",
 "types": "./index.d.ts"
}

https://unpkg.com/browse/@material-ui/core@5.0.0-alpha.20/styles/package.json

{
  "sideEffects": false,
  "module": "./index.js",
  "main": "..\\node\\styles\\index.js",
  "types": "./index.d.ts"
}

https://unpkg.com/browse/@material-ui/core@5.0.0-alpha.21/styles/package.json

It’s the first time we make a release from a Windows machine.

I’m also having the exact same problem, tried deleting node_modules and reinstalled without success, I’m using npm 7 and I don’t think my app uses adaptV4Theme.

@matchatype I’ve tried just now locally the https://github.com/mui-org/material-ui/tree/next/examples/nextjs-with-typescript and it builds and runs successfully. Would recommend comparing the config between your project and that one to see if something is different. It’s hard/impossible for us to debug the issue when we don’t have a clear repro.

I’m also seeing a build issue when using v5.0.0-alpha.21

This only occurs when importing the following:

import {createSvgIcon} from '@material-ui/core';

this imports from:

node_modules/@material-ui/icons/utils/createSvgIcon.js

which has a require statement that is referencing an esm file:

var _utils = require("@material-ui/core/utils");  // <-- culprit

Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /node_modules/@babel/runtime/helpers/esm/extends.js
require() of ES modules is not supported.

require() of /node_modules/@babel/runtime/helpers/esm/extends.js from /node_modules/@material-ui/core/utils/createSvgIcon.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.

Instead rename extends.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from /node_modules/@babel/runtime/helpers/esm/package.json.

@mnajdova hello! I was just having the same issue. Here’s a minimal reproduction based on the next npx create-next-app -e with-typescript repo:

https://github.com/flpvsk/mui-alpha-21-issue-24206

This is where MUI is imported: https://github.com/flpvsk/mui-alpha-21-issue-24206/blob/main/pages/_app.tsx

node -v # v15.5.0
npm -v # 7.3.0

@mnajdova Sorry, I comment in the wrong thread. Just post it in #24203. And StylesProvider works well, thanks a lot!