React Native : UIkitten Icons typeerror: undefined is not an object (evaluating 'iconsPack.name')

Question

I was trying to use the Eva Icons in UI Kitten but ended up getting this error, digging my head on this problem for a while, new to React and Reavt-Native, will be glad if someone could help me (:

render()
const FacebookIcon = (props) => (
  <Icon name='facebook' {...props} />
);
return(
  <Input
    value={this.state.id}
    label="FB ID"
    size="medium"
    placeholder="Enter your fb_id"
    onChangeText={(enteredText) => this.setState({ fbId: enteredText })}
    accessoryLeft={FacebookIcon}
/>


)

score 14 · Answer 1 · edited Jun 04 '20 at 16:19

First, run this command :

npm i @ui-kitten/eva-icons react-native-svg

Then register an icon package with IconRegistry.

As it's mentionned in the docs

import React from 'react';
import * as eva from '@eva-design/eva';
import { ApplicationProvider, IconRegistry, Layout, Text } from '@ui-kitten/components';
import { EvaIconsPack } from '@ui-kitten/eva-icons';

const HomeScreen = () => (
  <Layout style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
    <Text category='h1'>HOME</Text>
  </Layout>
);

export default () => (
  <>
    <IconRegistry icons={EvaIconsPack} />
    <ApplicationProvider {...eva} theme={eva.light}>
      <HomeScreen />
    </ApplicationProvider>
  </>
);

React Native : UIkitten Icons typeerror: undefined is not an object (evaluating 'iconsPack.name')

1 Answers1