Unable to Resolve Module in React Native App

react-native start --reset-cache solved the issue. https://github.com/facebook/react-native/issues/1924

If you are having similar issues with pure components or classes, ensure you are using .js extension instead of .jsx.

I was losing the will to live over this error, RN telling me that an imported file ./Foo did not exist when it was right there!

The actual underlying error was not a typo but actually in another file that ./Foo imported.

Be careful. If you are writing JSX anywhere (eg. in ./Bar):

<Bar>...</Bar>

then you must have:

import * as React from 'react' (or similar)

present in that file (./Bar).

When the syntactic sugar (angled brackets) is transpiled it naively spits out something like:

React.createComponent(...)

And if React has not explicitly been imported this reference will be invalid, so the evaluation of this dependent file subsequently fails.

Unfortunately the result is that consequently ./Foo (as well as ./Bar) will be unavailable in your app, and thus RN says unhelpful things like module not found and Indeed, none of these files exist.

Hope that helps.

ps. you can also experience similar misery if you have circular dependencies between files! Such fun!

Based on your folder structure, try import like this in index.js:

import { AppContainer } from './App/AppContainer';

If you are using a named export, that is if you are doing:

export class AppContainer [...]

If you are using a default export, such as:

export default class AppContainer [...]

The object destructuring will fail. You have to do instead:

import AppContainer from './App/AppContainer';

For me, using expo, I just had to restart expo. ctrl + c and yarn start or expo start and the run on ios simulator or your device, whichever you're testing with.