React native :Unable to resolve module Indeed, none of these files exist:
Solution 1
You're referencing it from the HomeScreen
component which is in the screens
directory. Because you're using the local ./ path, it's trying to find it in screens/customComponents
. Using ../customComponents/floating_title_text_input_field
should fix it.
Solution 2
You can clean the cache on your bundler:
npm start --clean-cache
Solution 3
Even though your mistake was using the wrong path during the require
statement, I think it might be useful to share how I solved this issue, where file import path wasn't the reason for the error. I encountered this issue after I added some image assets and required them in my components. But I forgot to build the app again. After several attempts, this is the solution that worked for me.
- Stop your development server.
- Install the app on your android device or emulator, using
yarn android/ios
. - Start the development server using
yarn start
.
Goku
serial up-voter/down-voter God Bless You keep patience karma will work
Updated on July 09, 2022Comments
-
Goku almost 2 years
I'm following this medium article to use
FloatingTitleTextInputField
in my react-native projectbelow is my project structure
Here is my code for
HomeScreen.js
import React, {Component} from 'react'; import {Text, View, TextInput, StyleSheet} from 'react-native'; import FloatingTitleTextInputField from './customComponents/floating_title_text_input_field'; export default class HomeScreen extends Component { render() { return ( // <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}> // <Text>My First React App</Text> // <TextInput style={{height: 40, borderColor: 'gray', borderWidth: 1}} /> // </View> <View style={styles.container}> <View style={styles.container}> <Text style={styles.headerText}>Its Amazing</Text> <FloatingTitleTextInputField attrName="firstName" title="First Name" value={this.state.firstName} updateMasterState={this._updateMasterState} /> <FloatingTitleTextInputField attrName="lastName" title="Last Name" value={this.state.lastName} updateMasterState={this._updateMasterState} /> </View> </View> ); } } var styles = StyleSheet.create({ container: { flex: 1, paddingTop: 65, backgroundColor: 'white', }, labelInput: { color: '#673AB7', }, formInput: { borderBottomWidth: 1.5, marginLeft: 20, borderColor: '#333', }, input: { borderWidth: 0, }, });
When i try to use
FloatingTitleTextInputField
insideHomeScreen.js
I'm getting below errorerror Unable to resolve module `./floating_title_text_input_field` from `React Native/AwesomeProject/screens/ HomeScreen.js`: The module `./floating_title_text_input_field` could not be found from `/React Native/AwesomeProject/screens/HomeScreen.js`. Indeed, none of these files exist: * `/React Native/AwesomeProject/screens/floating_title_text_input_field(.native||.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)` * `/React Native/AwesomeProject/screens/floating_title_text_input_field/index(.native||.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)`. Run CLI with --verbose flag for more details. Error: Unable to resolve module `./floating_title_text_input_field` from `React Native/AwesomeProject/screens/HomeScreen.js`: The module `./floating_title_text_input_field` could not be found from `/React Native/AwesomeProject/screens/HomeScreen.js`. Indeed, none of these files exist:
Can anybody help me to solve this issue
If need more information please do let me know. Thanks in advance. Your efforts will be appreciated.
-
Goku over 4 yearsThanks i have tried using
import FloatingTitleTextInputField from '../customComponents/FloatingTitleTextInputField';
but still getting same error -
Mike M over 4 yearsSorry, I had miswritten the file to be camel case. I've corrected above
-
Mike M over 4 years@Goku FWIW, rather than use relative paths I usually reference items from the project root, as in
myprojectname/customComponents/floating_title_text_input_field
. Best of luck -
Yonz about 2 yearsWild I had the same problem in expo. I renamed my file from someCamel to SomeCamel and VS code was fine with imports '../someCamel', even expo react native web was okay with it but Ios was not. Thanks, I was driving myself nuts b/c I would I have never checked the file name since the others were working fine.