React Native项目报不存在代码的fontSize类型错误致应用崩溃求助

控制台警告原文：

Warning: Failed prop type: Invalid prop `fontSize` of type `string` supplied to `Text`, expected `number`.
Bad object: {
  "fontSize": "24",
  "fontFamily": "ionicons",
  "fontWeight": "normal",
  "fontStyle": "normal"
}
    in Text (at create-icon-set.js:81)
    in Icon (at createIconSet.js:41)
    in Icon (at Routes.js:314)
    in RCTView (at View.js:34)
    in View (at createAnimatedComponent.js:240)
    in AnimatedComponent(View) (created by TabBarIcon)
    in RCTView (at View.js:34)
    in View (created by TabBarIcon)
    in TabBarIcon (created by TabBarBottom)
    in RCTView (at View.js:34)
    in View (created by TouchableWithoutFeedbackWrapper)
    in TouchableWithoutFeedback (created by TouchableWithoutFeedbackWrapper)
    in TouchableWithoutFeedbackWrapper (created by TabBarBottom)
    in RCTView (at View.js:34)
    in View (created by TabBarBottom)
    in RCTView (at View.js:34)
    in View (at createAnimatedComponent.js:165)
    in View (created by StackView)
    in StackView (created by StackView)
    in StackView
    in Unknown (created by Navigator)
    in Navigator (created by NavigationContainer)
    in NavigationContainer (at route.js:12)
    in Routers (at App.js:40)
    in PersistGate (at App.js:47)
    in Provider (at App.js:46)
    in App (created by ExpoRoot)
    in ExpoRoot (at renderApplication.js:45)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:106)
    in DevAppContainer (at AppContainer.js:121)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:132)
at node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer...

• 该错误核心是你给ionicons图标组件传的size属性是字符串格式的"24"，而React Native要求fontSize必须为数字类型。你找不到对应源码大概率是缓存、编译产物不同步，或者是动态配置/第三方依赖的问题，按以下步骤排查：

1. 全链路清理缓存重新编译 #

依次执行以下命令清理所有缓存后重新运行项目：

# 重新安装依赖
rm -rf node_modules && npm install
# 清理React Native打包缓存
npx react-native start --reset-cache
# 清理iOS构建缓存
cd ios && rm -rf Pods Podfile.lock build && pod install && cd ..
# 清理Android构建缓存
cd android && ./gradlew clean && cd ..

如果是Expo项目直接执行npx expo start --clear启动即可。

2. 定位路由文件的图标配置 #

错误栈明确指向Routes.js第314行的底部标签栏图标，检查你路由配置中底部导航的TabBarIcon逻辑，确认是否有地方直接把字符串格式的数值（比如全局主题变量、后端返回的配置、硬编码写的带引号的24）传给了Icon的size属性，修改为数字类型即可，如果是动态值可以用Number(size)做强制转换。

3. 检查第三方依赖版本 #

确认你使用的react-native-vector-icons、react-navigation导航库的版本是否存在已知的类型bug，如果是版本自带问题，回退到最近的稳定版本即可解决。

4. 全局检索可疑配置 #

在项目根目录全局搜索ionicons、"24"、fontSize相关的配置，排查是否有全局样式文件、主题配置中误写了字符串格式的字号。

5. 校验动态配置逻辑 #

如果你的图标字号是通过全局状态、远程下发参数动态赋值的，增加类型校验逻辑，确保赋值给size属性前已经转为数字类型。

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