RN项目中使用react-native-elements报错: Unrecognized font family 'Material Icons'
查询了一些方案,但各自的环境不尽相同,最后在google中找到了答案.主要问题在于
(1)版本问题
(2)Xcode配置问题
报错如下
解决步骤:
1 . 首先需要正确安装
npm i -S react-native-elements
npm i -S react-native-vector-icons@4
这里需要注意三点:
1 )react-native-vector-icons虽然被react-native-elements所依赖,但它并不会自动安装,需要手动安装
2 )截止目前,elements所依赖的vector-icons的版本必须是4.x, 之前安装了vector-icons@6.x导致报以上错误,很久才发现
3 ) 必须执行react-native link react-native-vector-icons 将该原生库添加到项目, 这是react-native官方的方法。因为vector-icons是原生库
执行该命令后如下
并且在Xcode的Resources内添加了字体(Fonts里的字体)
2 . 修改Xcode的项目配置
1 ) 使用Xcode打开项目, 在根目录下右击选择 "Add file to <项目名称>", 找到node_modules/react-native-vector-icons/Fonts
2 ) 在xcode的Info.plist文件中,加入: Fonts provided by application数组
图示入下
最后,再次运行项目react-native run-ios, 此时可以使用react-native-elements中的字体图标了, 大功告成!
RN项目中使用react-native-elements报错: Unrecognized font family 'Material Icons'的更多相关文章
- iOS原生项目中集成React Native
1.本文的前提条件是,电脑上已经安装了CocoaPods,React Native相关环境. 2.使用Xcode新建一个工程.EmbedRNMeituan [图1] 3.使用CocoaPods安装Re ...
- 【已解决】React项目中按需引入ant-design报错TypeError: injectBabelPlugin is not a function
react项目中ant-design按需加载,使用react-app-rewired的时候报错 运行npm start或者yarn start报如下错误: TypeError: injectBabel ...
- react项目中引入百度地图打包报错问题
一.我正常引入百度地图,调试时候是好使的,但是打包时候就报错 引入方法如下: 报错如图 正常调试是好使的,但是打包报这个错,解析不了这个BMap,那么怎么办呢? 然后我就转用了window办法,虽然因 ...
- react native 环境报错
按照react native中文网的文档安装 1.brew 管理软件 2.node 在终端启动工程后就报下面这个错误 这个错误是在RN在第一次配置环境启动一个工程的时候 ,在这过程中下载的缓存文件不完 ...
- React Native 日常报错
在学习React.js 或 React Native 过程中,有时看着别人的框架或代码,但总是会出现错误,因为React或之中用到的一些包经常更新,有些代码或教程就显得过旧了. 一.日常报错 'con ...
- 解决Vite-React项目中js使用jsx语法报错的问题
背景 在做存量项目接入Vite测试时发现,存量(老)项目中很多是直接在js中书写jsx语法,使用Vite启动时就会抛出一堆问题Failed to parse source. 不嫌麻烦可以跑个脚本批量修 ...
- 关于Eclipse项目中加入jquery.js文件报错(missing semicolon)问题
在使用Eclipse3.7及以后的版本的时候,加入jQuery文件会报错(missing semicolon),文件中会显示红色小X,虽然这个错误并不会影响项目的运行,但是这个却会大大的影响到开发人员 ...
- maven项目中各文件都没有报错,但是项目名称有红叉
项目报错可以看到Problems(可以在Window--Show View--other--输入Problems找到) 一.可能原因 1.项目中各文件没有报错,但是项目名称中 ...
- React Native 基础报错及解决方案记录
刚开始上手RN,碰到很多坑,记录一下.碰到问题多去看看github上面的issue! 启动命令react-native run-ios报错 1.:xcrun: error: unable to fin ...
- react native运行报错
更换RN项目目录位置后,react-native run-ios,出错. node_modules/react-native/ReactCommon/yoga/yoga/YGNodeList.c 解决 ...
随机推荐
- 【模板】HDU 1541 树状数组
http://acm.hdu.edu.cn/showproblem.php?pid=1541 题意:给你一堆点,每个点右一个level,为其右下方所有点的数量之和,求各个level包含的点数. 题解: ...
- ul li 的 float:left;
如 ul li{float:left;} 出来的效果不仅是原本默认竖着排的元素变横排,还是往左边排,重点是元素是按顺序排的,如果float等于right,则不仅是往右排,且元素是倒着排的,如原来的a ...
- linux:基本指令mkdir, rmdir 和rm
mkdir 建立文件夹 mkdir (make directory) 就是创建一个文件夹的意思, 使用起来很简单. 1.新建一个目录: $ mkdir folder2 如果你想在这个目录给 folde ...
- nginx rate limit
nginx rate limithttps://www.topjishu.com/12139.htmlhttps://blog.csdn.net/hellow__world/article/detai ...
- 可变数组(PLSQL)
可变数组 可变数组与嵌套表相似,也是一种集合.一个可变数组是对象的一个集合,其中每个对象都具有相同的数据类型.可变数组的大小由创建时决定.在表中建立可变数组后,可变数组在主表中作为一个列对待.从概念上 ...
- elasticsearch更新doc文档
在elasticsearch-head中: http://localhost:9200/my_index/products/2/ _update { "script" : { &q ...
- 添加linux系统调用的两种方式
原文:https://blog.csdn.net/sdulibh/article/details/51889279 向linux内核添加系统调用,一是通过编译内核添加,二是通过内核模块的方式添加: 一 ...
- 使用Maven根据WSDL生成生成Java代码
转载:https://blog.csdn.net/pzasdq/article/details/52601473 为便于自己学习,整理 修改pom.xml <project xmlns=&quo ...
- django时间的时区问题(转)
add by zhj: 使用django时,如果设置USE_TZ=True,那django在数据库中存储的是0时区的时间:如果USE_TZ=False,那存储的是本地时间 原文:https://www ...
- 【托业】【全真题库】TEST01-03-阅读题
[托业][全真题库]TEST01-03-阅读题