生产模式下react项目报错minified react error #130的问题

这天,线上突然出现了一个bug,某个页面打开空白,看控制台报错minified react error #130,在本地看却是正常的,百思不得其解。

后来发现是由于线上项目它的包更新过了,而我本地的包没有更新,所以我没能复现这个错误。

于是删掉node_modules,然后重新下载依赖,再运行项目,问题果然复现了,在生产模式下,我们可以看到更详细的提示:

image.png


image.png

由这两条信息,我们现在可以可以定位问题所在了,就是在我们SimRecordForm文件的145行附近,有一个element type is invalid的错误。

根据定位我找到如下代码


警报信息提示的位置

我们知道我们在react中写的jsx会被babel编译成React.createElement()模式,仅这段代码来说,它会转换成

复制代码
React.createElement(
                  'p',
                  {className:'ant-upload-drag-icon'},
                  React.createElement(InboxOutlined,null)
)

而警报信息提示我们element type is invalid,这意味着React.createElement的第一个参数错了,正好控制台提示

之前一直没注意到的提示

发现是由于InboxOutlined组件找不到了,导致React.createElement第一个参数错误,最终导致页面空白


image.png

解决办法就是把这个组件换掉······
© 著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务

喜欢的朋友记得点赞、收藏、关注哦!!!

相关推荐
__万波__1 分钟前
二十三种设计模式(二十三)--责任链模式
java·设计模式·责任链模式
TT哇2 分钟前
基础的IDEA基本使用,如:debug流程、常用快捷键
java·ide·intellij-idea
梵得儿SHI4 分钟前
(第七篇)Spring AI 核心技术攻坚:国内模型深度集成与国产化 AI 应用实战指南
java·人工智能·spring·springai框架·国产化it生态·主流大模型的集成方案·麒麟系统部署调优
北辰当尹14 分钟前
【实习之旅】Kali虚拟机桥接模式ping通百度
java·服务器·桥接模式
Justice Young16 分钟前
Hive第五章:Integeration with HBase
大数据·数据仓库·hive·hbase
qq_2562470517 分钟前
除了“温度”,如何用 Penalty (惩罚) 治好 AI 的“复读机”毛病?
后端
天远Date Lab17 分钟前
Python金融风控实战:集成天远多头借贷行业风险版API实现共债预警
大数据·python
Just Dreamchaser20 分钟前
Pdf和Docx文件导出生成水印工具类
java·给pdf和docx文件添加水印
Justice Young21 分钟前
Hive第三章:HQL的使用
大数据·数据仓库·hive·hadoop
这个需求做不了22 分钟前
Java实现文件格式转换(图片,视频,文档,音频)
java