使用MUI Accordion时出现‘isValidElement is not a function’报错求助

问题背景 #

我在Next.js项目中使用MUI的Accordion组件时，应用抛出大量Failed prop type: isValidElement is not a function警告，错误涉及AccordionSummary、Accordion内的Collapse、Paper以及AccordionSummary内的ButtonBase等组件，示例报错：

next-dev.js?3515:20 Warning: Failed prop type: isValidElement is not a function
at AccordionSummary (webpack-internal:///./node_modules/@mui/material/AccordionSummary/AccordionSummary.js:114:82)

已尝试将MUI升级至最新版本（@mui/icons-material": "^5.11.0", "@mui/material": "^5.11.3"），并使用官方最简示例代码，但错误依旧；移除所有Accordion实例后错误消失。在全新Next.js项目中测试相同代码可正常运行，推测是当前项目配置问题，但无法定位原因，求下一步调试方向。

调试步骤 #

• 检查React版本与多实例问题：MUI 5要求React 17.0.0及以上版本，执行npm ls react或yarn list react查看项目中是否存在多个React实例，或版本不符合要求的情况。多实例会导致React内部函数（如isValidElement）无法共享，引发此类错误。
• 排查Webpack/Next.js的React别名配置：若项目自定义了Webpack配置，检查是否设置了错误的React别名，导致MUI加载的React实例和项目主React实例不一致。比如错误地将React指向了非项目根目录的版本。
• 清理依赖缓存并重装：删除node_modules、package-lock.json（或yarn.lock），执行npm install（或yarn install），同时运行next clean清除Next.js的缓存，避免旧缓存代码干扰。
• 排查第三方依赖冲突：临时移除项目中的非核心依赖（尤其是旧版UI库、自定义组件库），逐个恢复并测试，定位是否有依赖与MUI 5产生冲突。比如同时存在Material-UI v4和MUI 5时，容易出现此类问题。
• 验证ThemeProvider配置：若项目使用了自定义的MUI ThemeProvider，尝试替换为官方默认的ThemeProvider（仅保留最基础的配置），检查错误是否消失，排除自定义主题配置导致的组件逻辑异常。
• 启用React Strict Mode：在next.config.js中开启React Strict Mode，该模式会放大潜在的组件问题，可能帮助定位到导致isValidElement异常的根源。
• 直接调试isValidElement：在使用Accordion的组件顶部添加以下代码，打印isValidElement的信息，确认其是否为正常的React函数：

  import { isValidElement } from 'react';
  console.log('isValidElement 函数:', isValidElement);
  console.log('函数来源:', isValidElement.toString());
  

  如果输出不是React官方的函数定义，说明该函数被第三方代码修改或覆盖，需要进一步排查。

内容的提问来源于stack exchange，提问作者Pinkney