1

React-native app can't find my ".js" files path and I'm not sure why. I try couple of ways, for example:

1- '../components/LoginScreen' 2- './LoginScreen' 3- './LoginScreen.js'

but same result.

Here is the error if someone can help me:

Looking for JS files in
   C:\Users\<User>\reactnewapp

Loading dependency graph, done.
 DELTA  [android, dev] ..\..\../index.js ▓▓▓▓▓▓▓▓▓▓▓░░░░░ 70.6% (526/626)::ffff:127.0.0.1 - - [08/Jun/2019:16:39:15 +0000] "GET /index.delta?platform=android&dev=true&minify=false HTTP/1.1" 500 - "-" "okhttp/3.12.1"
error: bundling failed: Error: Unable to resolve module `./LoginScreen` from `C:\Users\<User>\reactnewapp\App.js`: The module `./LoginScreen` could not be found from `C:\Users\<User>\reactnewapp\App.js`. Indeed, none of these files exist:
  * `C:\Users\<User>\reactnewapp\LoginScreen(.native||.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)`

Even when I put the './' it doesn't offer me a path.

App.js :

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View, Button} from 'react-native';
import MainNavigator from './LoginScreen';


export default class App extends Component {
  render() {
    return (

      <React.Fragment>
      <MainNavigator/>
      </React.Fragment>
    );
  }
}

Folders screenshots:

enter image description here

enter image description here

14
  • Could you show us the content of the App.js file as well as a list of the files and folders in the directory? Commented Jun 8, 2019 at 16:52
  • In components folder there is only one js file LoginScreen, nothing else. But okay I will show you the App.js file. Commented Jun 8, 2019 at 16:55
  • Does the LoginScreen file has a .js extension? Commented Jun 8, 2019 at 16:57
  • You mean if there are some other files imported inside? Commented Jun 8, 2019 at 16:58
  • No I mean is the file called "LoginScreen" or "LoginScreen.js"? Commented Jun 8, 2019 at 16:59

1 Answer 1

1

You are trying to import a file called "LoginScreen" located in the same folder. But your file is in the /components directory.

Change your import to:

import MainNavigator from './components/LoginScreen';

One dot is to indicate the current directory, which is what you want here. Two dots would be to indicate the parent directory.

Sign up to request clarification or add additional context in comments.

3 Comments

Thanks a lot it worked. But why it's different? In Expo project it is with two dots, or only './LoginScreen';
Maybe your App.js file was located in the /components folder in your Expo project?
No, this is brand new project. I worked before with Expo and now I start with react-native projects.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.