react native坑-优快云博客

本文介绍如何在React Native项目中安装并使用react-native-vector-icons库，包括必要的npm命令及Xcode配置步骤，帮助开发者轻松集成多种常用图标。

没有library文件：

这种情况下需要安装那些文件

npm install
复制代码

#node_modules文件夹里面存放的是各种第三方库呀什么的比如redux、react-native-vector-icons、react、react-native等等

react-native-vector-icons

  关于在React Native中使用iconfont，网上已有很多非常好的解决方案，用的最多的就是 react-native-vector-icons , 这个库支持很多常用的iconfont,比如FontAwesome, Ionicons, MaterialIcons等等。
  但是这个库依赖了不少iOS和Android的原生代码，这让一个前端开发脸上浮现了一个大大的懵逼。 而且自带的字体文件都偏大，做起精简来简直想哭，更别说加入自定义的iconfont了。
复制代码

npm install react-native-vector-icons --save //添加到项目文件中，进入到项目的根目录，添加完成之后会在node_modules文件夹中看到

react-native-vector-icons的简单使用,图片,按钮,标签视图,导航条
ICONS是可以直接使用图片名, 就能加载图片的三方,使用很方便, 你不需要在工程文件夹里塞各种图片, 节省很多空间,下面就来看看怎么使用吧!

1. 首先打开terminal进入到我们的工程文件夹下, (不会创建工程的请参考:http://blog.youkuaiyun.com/margaret_mo/article/details/51304062)

输入: npm install react-native-vector-icons --save (回车)

输入: npm install rnpm -g

输入: rnpm link (回车)  

2. 在Finder中用Xcode打开工程: .../Demo/ios/Demo.xcodeproj

(1).右键工程文件Add Files to "(你工程名)"

(2).选择node_modules/react-native-vector-icons/Fonts文件

(3).点击"完成".

FontAwesome 有很多图标不需要自己添加

复制代码