# URNS Fundamentals - 13 : card component : invalid call require(image)

**URL:** <https://forum.codewithmosh.com/t/urns-fundamentals-13-card-component-invalid-call-require-image/1311>\
**Category:** React Native\
**Created:** [December 17, 2020, 4:46pm UTC](https://forum.codewithmosh.com/t/urns-fundamentals-13-card-component-invalid-call-require-image/1311 "2020-12-17T16:46:03Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Stanishlag](https://avatars.discourse-cdn.com/v4/letter/s/edb3f5/32.png) [@Stanishlag](https://forum.codewithmosh.com/u/Stanishlag)\
**Post date:** [December 17, 2020, 4:46pm UTC](https://forum.codewithmosh.com/t/urns-fundamentals-13-card-component-invalid-call-require-image/1311/1 "2020-12-17T16:46:03Z")

</div>

Hello, I am following the class and doing the exercice in order to create the card component.  
I struggled and looked for the solution but I might have an issue.

Here you will find my AppCard component :

```
function AppCard({ title, subTitle, imagePath}) {
return (
    console.log(imagePath),
    <View style={styles.CardStyle}>

        <Image source = {require(imagePath)}></Image>

        <Text style={styles.TitleStyle}>
            {title}
        </Text>
       
        <Text style={styles.SubtitleStyle}>
            {subTitle}
        </Text>
    
    </View>
);

```

}

But when I want to test it, with the following code in App.js :

```
   <AppCard
title = "Item1"
subTitle = "100 balles"
imagePath = "../assets/lu.jpg"

```

> 

I have the following error message :  
TransformError app\components\AppCard.js: app\components\AppCard.js:Invalid call at line 9: require(imagePath)

Does anyone see where would be my mistake ? What I should do ?  
I debugged with console.log to check the path (and I commented the image part of the card) and the path is good, even if it’s printed two times, and the first time it seems to be undefined (could it come from there ?)

Thank you for reading this and helping me out 🙂

---

<div class="post-metadata">

**Author:** ![Stanishlag](https://avatars.discourse-cdn.com/v4/letter/s/edb3f5/32.png) [@Stanishlag](https://forum.codewithmosh.com/u/Stanishlag)\
**Post date:** [December 18, 2020, 11:52am UTC](https://forum.codewithmosh.com/t/urns-fundamentals-13-card-component-invalid-call-require-image/1311/2 "2020-12-18T11:52:30Z")

</div>

Ok so I found the mistake, don’t put hte require statement in your Card component, here’s the fix :

```
unction AppCard({ title, subTitle, imagePath}) {

```

return (  
console.log(imagePath),

```
    <Image source = {imagePath}></Image>

    <Text style={styles.TitleStyle}>
        {title}
    </Text>
   
    <Text style={styles.SubtitleStyle}>
        {subTitle}
    </Text>

</View>

```

);

And when you create your Card :

```
      <AppCard

```

title = “Item1”  
subTitle = “100 balles”  
imagePath = {require("…/assets/lu.jpg")}\>