Question

我在本机响应中收到以下错误-fontFamily“ ionicons”不是系统字体，并且尚未通过Font.loadAsync加载。

如果要使用系统字体，请确保输入正确的名称，并且设备操作系统支持该名称。

我正在尝试导入博览会矢量图标。

import { Ionicons } from '@expo/vector-icons';

并使用图标

<Button transparent>
            <Ionicons name="md-checkmark-circle" size={32} color="green" />
        </Button>

但出现上述错误。

Answer 1

在看了几个小时后，我发现了另一个可行的解决方案，这些代码应该可以工作，并且与示例和先前的出色答案相同。

如果您正在升级Expo，这可能是您的答案。

删除node_modules
删除package-lock.json
运行expo install
运行expo start -c

Answer 2

库@expo/vector-icons仅默认安装在通过expo init --的模板项目上，它是expo软件包的一部分。

如果您使用react-native init创建了项目，请改用react-native-vector-icons

安装

npm i react-native-vector-icons

react-native link react-native-vector-icons

用法

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

<Button transparent>
    <Icon name="md-checkmark-circle" size={32} color="green" />
</Button>

OR

尝试在您的Font.loadAsync中使用App.js加载离子离子

async componentDidMount () {
    await Expo.Font.loadAsync({
        Ionicons: require('@expo/vector-icons/fonts/Ionicons.ttf'),
    });

Answer 3

如果无法使用node_modules，请确保您没有安装expo-font的多个版本。

从expo-font中删除node_modules/expo/node_modules/expo-font/。
从expo-font移除node_modules/expo/package.json依赖性列表。
运行expo r -c

有关详细信息Expo cannot load a font due to multiple versions of expo-font installed。

Answer 4

在Iconicons中添加loadAsync为我解决了这个错误。

async componentDidMount () {
    await Expo.Font.loadAsync({
        Ionicons: require('@expo/vector-icons/fonts/Ionicons.ttf'),
    });

Answer 5

我通过删除代码中的<Icon\>标签解决了这个问题。

仅保留<Ionicons\>个图标标签后，我就被保存了。

Answer 6

我已通过expo upgrade解决了此问题，以防其他人看到。

我在响应本机时遇到错误-fontFamily“ ionicons”不是系统字体

6 个答案: