react-native – 反应本机图标

前端之家收集整理的这篇文章主要介绍了react-native – 反应本机图标前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
有人尝试使用反应本机图标?我按照这些步骤:

> npm install react-native-icons @ latest –save
>在XCode中,在项目导航器中,右键单击库➜将文件添加到[您的项目名称]
>转到node_modules➜react-native-icons➜ios并添加ReactNativeIcons.xcodeproj
>将libReactNativeIcons.a(从“ReactNativeIcons.xcodeproj下的”Products“)添加到项目的构建阶段➜链接二进制库与库阶段
>将您要使用的字体文件添加到项目的“复制包资源”构建阶段(单击“’并单击”添加其他…“,然后从node_modules / react-native-icons / ios / Libraries中选择字体文件/ FontAwesomeKit).
运行你的项目(Cmd R)

我的代码

  1. var React = require('react-native');
  2. var Icon = require('FAKIconImage');
  3. var { AppRegistry,StyleSheet,Text,View} = React;
  4.  
  5. class BringgersApp extends React.Component {
  6.  
  7. constructor(props) {
  8. super(props);
  9. }
  10.  
  11. render() {
  12. return(
  13. <View style={styles.container}>
  14. <Text style={styles.welcome}>
  15. Welcome to Bringgers!
  16. </Text>
  17. <Icon
  18. name='ion|beer'
  19. size={150}
  20. color='#887700'
  21. style={styles.beer} />
  22. </View>
  23. )
  24. }
  25. }
  26.  
  27. var styles = StyleSheet.create({
  28. container: {
  29. flex: 1,justifyContent: 'center',alignItems: 'center',backgroundColor: '#F5FCFF',},welcome: {
  30. fontSize: 20,textAlign: 'center',margin: 10,instructions: {
  31. textAlign: 'center',color: '#333333',marginBottom: 5,});
  32.  
  33. React.AppRegistry.registerComponent('BringgersApp',function() { return BringgersApp });

我建立后,他说该文件不存在…

  1. Font file doesn't exist

我清理DerivedData并尝试构建很多次,但不起作用.

首先,

>反馈 – 本土图标的维护者指向较新的&维持react-native-vector-icons
>显然,截至目前,rnpm项目已经合并为反应性.

换句话说,你的生活可以像打字一样简单

  1. react-native install react-native-vector-icons
  2. react-native link react-native-vector-icons

你可能会很好* *

*)至少它在我的机器上工作

猜你在找的React相关文章