如何在expo sdk33中加载“ionicons”字体？

Question

升级到 expo sdk 33.0.0 后，当我构建 React Native expo 应用程序时，一切正常，但应用程序启动后，就会显示以下错误：

fontFamily“ionicons”不是系统字体，尚未通过 Font.loadAsync 加载

更新之前我使用的是 sdk 版本 32.0.0，一切正常。

我尝试在我的 app.js componentDidMount 函数中添加字体，如下所述https://docs.expo.io/versions/latest/guides/using-custom-fonts/：

const Ionicons = require("./fonts/Ionicons.ttf");
...
componentDidMount() {
    ...
    Font.loadAsync({
        "Avenir-Book": AvenirBook,
        "Avenir-Light": AvenirLight,
        "Ionicons": Ionicons,
    })
}
...

我还尝试将 loadAsync 中的名称从“Ionicons”更改为“ionicons”，但没有任何改变。

字体文件夹文件内的“Ionicons.ttf”是从node_modules / @expo/vector-icons/build/vendor/react-native-vector-icons/Fonts文件夹复制的

---------编辑--------- 在我所有的 React Native Expo 项目 src 中，我没有对 Ionicon 的单个引用

感谢任何帮助，谢谢

Answer 1

要导入Ionicons图标，请执行以下操作

import { Ionicons } from '@expo/vector-icons';
// use like
<Ionicons name="md-checkmark-circle" size={32} color="green" />

要导入自定义字体，请添加所需字体的路径。

import { Font } from 'expo';

componentDidMount() {
  Font.loadAsync({
    'open-sans-bold': require('./assets/fonts/OpenSans-Bold.ttf'),
  });
}