You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

调用makeStyles时抛出错误,MUI样式功能突发故障求助

解决MUI makeStyles突然失效的问题

问题根源

MUI v5 已将 makeStyles 从核心包 @mui/material 中剥离,独立为 @mui/styles 包,默认不会随 @mui/material 一起安装,所以直接导入会提示路径不存在。

修复步骤

  1. 安装@mui/styles包
    在项目根目录执行以下命令:
    # npm
    npm install @mui/styles
    # yarn
    yarn add @mui/styles
    
  2. 修正导入语句
    将原导入代码替换为:
    import { makeStyles } from "@mui/styles";
    
  3. 版本兼容检查
    确保 @mui/styles 与 @mui/material 的版本完全一致,避免因版本不匹配导致的异常。可查看 package.json 文件中的版本号,若不一致,执行以下命令统一版本:
    # npm
    npm install @mui/material@latest @mui/styles@latest
    # yarn
    yarn add @mui/material@latest @mui/styles@latest
    

额外建议

MUI v5 官方更推荐使用 styled API 或 sx prop 来替代 makeStyles,如果项目有长期维护计划,可考虑逐步迁移到这些更符合v5设计理念的样式方案。

内容的提问来源于stack exchange,提问作者Stefan Talevski

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.14 09:50:32