這天,線上突然出現(xiàn)了一個bug松却,某個頁面打開空白,看控制臺報錯minified react error #130溅话,在本地看卻是正常的晓锻,百思不得其解。
后來發(fā)現(xiàn)是由于線上項目它的包更新過了飞几,而我本地的包沒有更新砚哆,所以我沒能復現(xiàn)這個錯誤。
于是刪掉node_modules屑墨,然后重新下載依賴躁锁,再運行項目,問題果然復現(xiàn)了卵史,在生產(chǎn)模式下战转,我們可以看到更詳細的提示:
image.png
image.png
由這兩條信息,我們現(xiàn)在可以可以定位問題所在了以躯,就是在我們SimRecordForm文件的145行附近槐秧,有一個element type is invalid的錯誤。
根據(jù)定位我找到如下代碼
警報信息提示的位置
我們知道我們在react中寫的jsx會被babel編譯成React.createElement()模式,僅這段代碼來說刁标,它會轉(zhuǎn)換成
React.createElement(
'p',
{className:'ant-upload-drag-icon'},
React.createElement(InboxOutlined,null)
)
而警報信息提示我們element type is invalid颠通,這意味著React.createElement的第一個參數(shù)錯了,正好控制臺提示之前一直沒注意到的提示
發(fā)現(xiàn)是由于InboxOutlined組件找不到了命雀,導致React.createElement第一個參數(shù)錯誤蒜哀,最終導致頁面空白
image.png
解決辦法就是把這個組件換掉······