react-native-vector-icons 图标显示错误

操作步骤：

1. 安装npm install --save react-native-vector-icons
2. 配置（android ），在 android/app/build.gradle 文件下添加以下代码

apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

3. 使用

import Icon from 'react-native-vector-icons/FontAwesome';
<Icon name="rocket" size={30} color="#900" />;

报错：

4. 查询官网发现自己少配置了一个字体文件。（官网链接：github.com/oblador/rea…

发现拷贝到 build.gradle 文件中，还是会报一样的错。

5. 最后发现所有的问题都出在了不对应上。

• 导入文件要与使用的 icon name 对应。 （oblador.github.io/react-nativ…

比如想要使用的是stepforward这个icon，那么需要引入的具体字体是 AntDesign

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

<Icon name="stepforward" size={30} color="#900" />;

• 把对应的字体包引入

  如果不写以下配置，则需要手动把react-native-vector-icons的Font文件中相应的包拷贝到项目的 android/app/src/main/assets/fonts 目录下。

project.ext.vectoricons = [
    iconFontNames: [ 'AntDesign.ttf' ]
]