Unable to resolve module from App.js - React Native

Question

I am quiet new to react and I know this is something stupid but I really cant see it.

I get the following error : Unable to resolve "./app/components/Apptext" from "App.js"

import React, { Component } from 'react';
import { Text,StyleSheet,Platform } from 'react-native';

function AppText ({children})
{
return <Text style = {styles.text}>{children}</Text>
}



const styles = StyleSheet.create({

text:{
    color:"tomato",
   

    ...Platform.select({
        ios:{
            fontSize:20,
            fontFamily:"Avenir"
        },
        android:{
            fontSize:18,
            fontFamily:"Roboto"
        }
    })
},

})
export default AppText;

The above is my AppText script

this is the app.js

import { StatusBar } from 'expo-status-bar';
import React, { Fragment } from 'react';
import {Dimensions ,SafeAreaView, StyleSheet,TouchableWithoutFeedback,Alert, Text, View ,Image, Button,Platform, BackHandler} from 'react-native';
import{ useDimensions,useDeviceOrientation } from '@react-native-community/hooks';
import WelcomeScreen from './app/screens/WelcomeScreen';
import AppText from './app/components/Apptext';


export default function App() {
  return (
<View style ={{flex:1,justifyContent:"center",alignItems:"center",}}>
      <AppText>I like react</AppText>
    </View>
    
    
    );
}

Is the AppText.js file inside a components folder which is inside an app folder? — Shamar Yarde, Nov 25 '20 at 19:01
Did you try reloading the application, or cleaning the cache: https://stackoverflow.com/a/41049449/8121551 or https://medium.com/@abhisheknalwaya/how-to-clear-react-native-cache-c435c258834e? The simulator might be using a previous build which was looking for the wrong directory. — Shamar Yarde, Nov 27 '20 at 13:55

score 0 · Answer 1 · answered Nov 26 '20 at 04:10

0

Please check the folder order from the app.js file/

answered Nov 26 '20 at 04:10

Muralishankar Sundaram

13
3

app.js is in the root folder and the Apptext script being sub folder called /app/components/Apptext – Noaman Khalil Nov 26 '20 at 07:29

score 0 · Accepted Answer · answered Nov 27 '20 at 15:15

No idea why but react had a issue with how i implmented this script, I changed it to the way below and it seems to be working fine.

import React from "react";
import { Text, StyleSheet, Platform } from "react-native";

function AppText({ children, style }) {
  return <Text style={[styles.text, style]}>{children}</Text>;
}

const styles = StyleSheet.create({
  text: {
    fontSize: 18,
    fontFamily: Platform.OS === "android" ? "Roboto" : "Avenir",
  },
});

export default AppText;

score 0 · Answer 3 · answered Sep 27 '22 at 04:42

0

Better check the files of screens must be inside in the core project folder.. I made a mistake now I sort it out

answered Sep 27 '22 at 04:42

Nithish kumar Thiruchelvam

1
1

1

As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Sep 29 '22 at 23:18

Unable to resolve module from App.js - React Native

3 Answers3