React Native iOS报Unrecognized font-family 'open-sans-bold'求解
React Native iOS 自定义字体报 Unrecognized font family 问题修复
这个报错核心原因基本都是iOS 不按文件名识别字体,只认字体文件内置的 PostScript 名称,按以下步骤逐一排查就能解决:
- 先检查代码里的字体名拼写:你贴的报错信息里
open-sans-bold末尾多了一个空格,先全局搜下代码里写fontFamily: 'open-sans-bold'的位置,确认没有多余空格、大小写错误。 - 确认字体的真实可用名称:不要直接用文件名当
fontFamily值。把assets/fonts/下的open-sans-bold.ttf双击用macOS自带的字体册打开,点击字体册顶部菜单栏的「显示」-「显示字体信息」,找到信息面板里的「PostScript 名称」字段,这个字段的值才是代码里fontFamily需要传的正确值。常规Open Sans Bold的PostScript名是OpenSans-Bold,和你现在写的全小写带横杠的文件名完全不一样,这是最常见的触发原因。 - 全量清理缓存避免旧配置干扰:
- 关闭当前运行的Metro服务,打开iOS模拟器选择顶部菜单栏「Device」-「Erase All Content and Settings」清空模拟器残留数据
- 进入项目的
ios目录,依次执行pod deintegrate、pod install重新关联iOS依赖 - 回到项目根目录,执行
npx react-native start --reset-cache启动带缓存清理的Metro服务 - 新开终端窗口执行
npx react-native run-ios重新编译安装项目
- 核对Xcode配置:用Xcode打开ios目录下的.xcworkspace文件,做两项检查:
- 打开项目的
Info.plist,找到UIAppFonts(对应显示名是「Fonts provided by application」)配置项,确认数组里的字体文件名和你assets目录下的ttf文件名完全一致(iOS对文件名大小写敏感,差一个大小写都会识别失败) - 选中项目target,进入「Build Phases」-「Copy Bundle Resources」列表,确认两个open sans的ttf文件都在列表内,如果不存在就点列表底部的+号,选中字体文件添加,勾选「Copy items if needed」选项。
- 打开项目的
内容的提问来源于stack exchange,提问作者Babou
相关产品推荐
相关产品推荐

