如何为react-native-macos添加字体？解决FontAwesome识别失败问题

1. 确认字体文件的正确部署 #

• 检查node_modules/react-native-vector-icons/Fonts目录下是否存在FontAwesome.ttf文件。
• 手动创建macos/myapp-macOS/Fonts文件夹（如果不存在），将FontAwesome.ttf复制到该目录。
• 打开Xcode项目，右键点击项目根目录，选择「Add Files to [你的项目名]」，选中Fonts文件夹，勾选「Copy items if needed」和「Create groups」后完成添加。

2. 修正Info.plist配置格式 #

你当前的ATSApplicationFontsPath使用了数组类型，正确配置应为字符串格式：

<key>ATSApplicationFontsPath</key>
<string>Fonts/</string>

注意末尾的斜杠不可省略，它指定加载Fonts目录下的所有字体文件。

3. 清理缓存并重建项目 #

• 关闭Xcode，执行React Native缓存清理命令：

  npx react-native cache clean
  

• 删除macos/build目录，彻底清除旧构建文件。
• 重新打开Xcode，按Shift+Command+K执行「Clean Build Folder」，再重新编译运行项目。

4. 手动声明加载的字体 #

在Info.plist中添加UIAppFonts配置，明确指定要加载的字体文件：

<key>UIAppFonts</key>
<array>
    <string>FontAwesome.ttf</string>
</array>

5. 调整字体加载逻辑的时机 #

确保Icon.loadFont()在组件初始化阶段调用：

import Icon from 'react-native-vector-icons/FontAwesome';

// 类组件写法
componentDidMount() {
  Icon.loadFont();
}

// 函数组件写法
useEffect(() => {
  Icon.loadFont();
}, []);

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