React-native: Cannot find entry file index.ios.js [index.android.js] in any of the roots

[MyTotoro]

[edit #2: this is now fixed as of 0.45.1 and 0.46.0-rc.2 - @hramos]

[edit: [scroll down for additional details](https://github.com/facebook/react-native/issues/14246#issuecomment-307205124) - @hramos]

Description

Recently upgrade to RN 0.45 from 0.42 (I was hit with #14225 and I figured I might as well spend the time migrating)

Error in Bundler:

error: bundling: Error
    at DependencyGraph._getAbsolutePath (/Users/mytotoro/Desktop/app/node_modules/react-native/packager/src/node-haste/DependencyGraph.js:280:11)
    at DependencyGraph.getDependencies (/Users/mytotoro/Desktop/app/node_modules/react-native/packager/src/node-haste/DependencyGraph.js:218:26)
    at Resolver.getDependencies (/Users/mytotoro/Desktop/app/node_modules/react-native/packager/src/Resolver/index.js:107:27)
    at /Users/mytotoro/Desktop/app/node_modules/react-native/packager/src/Bundler/index.js:591:37
    at Generator.next (<anonymous>)
    at step (/Users/mytotoro/Desktop/app/node_modules/react-native/packager/src/Bundler/index.js:12:445)
    at /Users/mytotoro/Desktop/app/node_modules/react-native/packager/src/Bundler/index.js:12:605
    at process._tickCallback (internal/process/next_tick.js:109:7)
Bundling `index.android.js`  0.0% (0/1), failed.

and red screen showing

Response error 404, Cannot find entry file index.android.js in any of the roots: [\"/Users/mytotoro/desktop/app/node_modules/react-native/packager\"]

With NotFoundError

Looking for JS files in
   /Users/mytotoro/Desktop/app/node_modules/react-native/packager 


React packager ready.

Reproduction Steps and Sample Code

"react": "^16.0.0-alpha.12",
"react-native": "^0.45.0-rc.2",

Mac: 10.12.4
node: v7.10.0
npm: 4.6.1

I run react-native run-android from the root directory of my project as I have always been doing:

total 456
-rw-r--r--    1 mytotoro  staff     175 Apr  7 23:36 index.ios.js
-rw-r--r--    1 mytotoro  staff     175 Apr  7 23:36 index.android.js
drwxr-xr-x    7 mytotoro  staff     238 Apr  7 23:36 Tests
-rw-r--r--    1 mytotoro  staff    2113 Apr  7 23:36 README.md
drwxr-xr-x    6 mytotoro  staff     204 Apr  7 23:37 ignite
drwxr-xr-x   15 mytotoro  staff     510 Apr  7 23:38 App
-rw-r--r--    1 mytotoro  staff  216323 Apr  7 23:39 yarn.lock
drwxr-xr-x   15 mytotoro  staff     510 May 29 13:42 android
-rw-r--r--    1 mytotoro  staff    3888 May 29 14:18 package.json

This issue comes up for iOS as well (I run on device through xcode) but the offending file is index.ios.js

[edit: adding duplicates -@hramos]

Duplicates

• #14314
• #14366
• #14376
• #14386

[willdawsonme]

Run the packager first with npm start -- --reset-cache from your project's root directory, then run react-native run-android.

[MyTotoro]

@willdawsonme this does fix it, is there a way to make the fix more permanent (Normally, when I ran react-native run-android, a new terminal window would pop up)

New terminal, doesn't work:

Looking for JS files in
   /Users/mytotoro/Desktop/app/node_modules/react-native/packager 

Now when I run npm start -- -reset-cache first - runs in place of current terminal

Looking for JS files in
   /Users/mytotoro/Desktop/app

[willdawsonme]

You should only need to run this once after an upgrade. The 'run-android' step essentially runs npm start if there are no packagers already running, so there's no harm starting them separately once. You might be able to pass a reset cache flag to run-android, but I've not tried it.

On 30 May 2017, at 12:38 pm, MyTotoro [e-mail] wrote:

@willdawsonme this does fix it, is there a way to make the fix more permanent (Normally, when I ran `react-native run-android, a new terminal window would pop up)

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub, or mute the thread.

[D1no]

I encounter the exact same issue now with 0.45.0-rc.2 in a fresh react-native init project.

[a7ul]

Same here .. upgraded to 0.45 and facing this issue of having to do --reset-cache everytime before doing react-native run-ios or android .
Anyone found a permanent fix ?

[mrgoonie]

It seems to be a common issue, I had this issue too with 0.45-rc2

[vgalkin]

Having same issue after upgrading.

[ben-snaize]

Also seeing this. Notice that after react-native run-ios the packager is doing the following (same symptoms as @MyTotoro):

Looking for JS files in /Users/me/App/node_modules/react-native/packager

After npm start -- -reset-cache

Looking for JS files in /Users/me/App

Clearly the first time around the bundle location is set incorrectly.

[markmadlangbayan]

Same here, steps to reproduce and temp fix:

$ react-native init testapp
# testapp created

$ cd testapp

$ react-native -v
react-native-cli: 2.0.1
react-native: 0.45.0

$ react-native run-ios
# On simulator, I'm getting:
# Cannot find entry file index.ios.js in any of the root ["../testapp/node_modules/react-native/packager"]

Temporary fix:

1. Close terminal launched by running react-native run-ios
2. Run the following:

$ npm start -- --reset-cache
Loading dependency graph, done.

1. On simulator, type cmd + r
   _Simulator will load the project properly._

Note: I have to do the temporary fix every single time.

[ekryski]

Yup this is a legit defect, I also ran into it.

I haven't been paying as much attention to the packager updates as of late but I _think_ it was introduced in the latest v0.45 release. Not seeing it in v0.44.

Possibly in this commit? https://github.com/facebook/react-native/commit/a26e0427846796809afb8a5742f864d733cad440

Basically when the packager is started automatically it doesn't have the correct root directory to traverse from.

cc/ @davidaurelio

[dadsteph]

I got the same trouble, any permanent fix?

[ragibkl]

I have the same problem here. Currently affecting me when starting on a new project.
@ekryski is right, this issue is not present in v0.44
Hence, my current workaround is to init the new React Native project, using React Native v0.44

1. Install rninit (https://www.npmjs.com/package/rninit)
   npm i -g rninit
2. Init project with react-nativev0.44.0 (https://www.npmjs.com/package/rninit#usage)
   rninit init [Project Name] --source [email protected]

I guess I'll upgrade react native version in my project when this is fixed upstream.

Edit: Ok, I feel dumb now. react-native-cli already does this. Forget what I wrote above.
react-native init [Project Name] --version 0.44.0

[RaymondChuh]

Ran into same problem and temporary fix works in my case.

[mrgoonie]

Still the same on 0.46.0-rc.0 (released a few hours ago)

[onurersel]

Having the same issue. Running packager with npm start before launching the app with react-native run-ios solves the problem though.

react-native-cli: 2.0.1
react-native: 0.45.0

[hramos]

I'm consolidating various related issues into this one. As far as I can tell, #14314, #14366, #14376, and #14386 are all duplicates.

Description

React Native projects built with native code targeting 0.45 are encountering an issue during app launch, where the app is unable to connect to the packager. The user is presented with a RedBox error with the following text:

Cannot find entry file index.ios.js in any of the roots: ["/path_to_app/node_modules/react-native/packager"]

User reports claim the same issue affects Android, which may result in an error like so (included here for discoverability/search):

Cannot find entry file index.android.js in any of the roots: ["/path_to_app/node_modules/react-native/packager"]

The packager displays the following error when the RedBox is displayed:

./node_modules/react-native/packager ~
 ┌────────────────────────────────────────────────────────────────────────────┐ 
 │  Running packager on port 8081.                                            │ 
 │                                                                            │ 
 │  Keep this packager running while developing on any JS projects. Feel      │ 
 │  free to close this tab and run your own packager instance if you          │ 
 │  prefer.                                                                   │ 
 │                                                                            │ 
 │  https://github.com/facebook/react-native                                  │ 
 │                                                                            │ 
 └────────────────────────────────────────────────────────────────────────────┘ 
Looking for JS files in
   /path_to_app/node_modules/react-native/packager 


React packager ready.

Loading dependency graph, done.
error: bundling: Error
    at DependencyGraph._getAbsolutePath (/path_to_app/node_modules/react-native/packager/src/node-haste/DependencyGraph.js:280:11)
    at DependencyGraph.getDependencies (/path_to_app/node_modules/react-native/packager/src/node-haste/DependencyGraph.js:218:26)
    at Resolver.getDependencies (/path_to_app/node_modules/react-native/packager/src/Resolver/index.js:107:27)
    at /path_to_app/node_modules/react-native/packager/src/Bundler/index.js:591:37
    at Generator.next (<anonymous>)
    at step (/path_to_app/node_modules/react-native/packager/src/Bundler/index.js:12:445)
    at /path_to_app/node_modules/react-native/packager/src/Bundler/index.js:12:605
    at process._tickCallback (internal/process/next_tick.js:103:7)
Bundling `index.ios.js`  0.0% (0/1), failed.

Reproduction Steps and Sample Code

This can be reproduced on a clean, new project. First, create a new project using the CLI, then start the packager and launch the app:

react-native init MyApp
cd MyApp
react-native run-ios

At this point, the iOS Simulator will launch and display a RedBox with the error Cannot find entry file index.ios.js in any of the roots: ["/redacted/MyApp/node_modules/react-native/packager"], where redacted is the actual path to the parent folder of the project.

Solution

The user may work around this issue by killing the packager that is launched by react-native run-ios, and starting an independent packager using npm start. At this point, the user may tap Reload JS or hit Cmd+R to connect the iOS Simulator to the new packager instance, resolving the RedBox error.

Additional Information

• React Native version: 0.45
• Platform: iOS (user reports claim this affects Android as well, but was not verified by yours truly)
• Development Operating System: macOS Sierra
• Dev tools:
  
  
  
  • react-native-cli: 2.0.1
  
  

[yemarnevets]

At this point, the iOS Simulator will launch and display a RedBox with the error Cannot find entry file index.ios.js in any of the roots: ["/redacted/MyApp/node_modules/react-native/packager"], where redacted is the actual path to the parent folder of the project.

Great stuff @hramos .

Do you have any idea why running 'npm start' after re-creating the issue works? I ran into the same issue (entry file index.ios.js not found) after several days hiccup free. However, today I did some Django work in a Python3 virtualenv. When I came back to ReactNative I ran into the same issue you detailed above.

• react-native: 0.45
• platform: iOS
• macOS Sierra (10.12.5)
• react-native-cli: 2.0.1

[hramos]

14412 should fix this in master. We'll need to cut a new 0.45 release.

[ben-snaize]

@hramos - Awesome, when is this going to be available?

[zachlucas]

How does a bugfix release like this work? Will it be semantic versioning for npm? like npm install [email protected]?

[hramos]

This is now fixed as of 0.45.1, thanks to @skevy.

Run npm install react-native to install the latest version which is now 0.45.1, or run npm install [email protected] if you want to be explicit.

If you were targeting the RC, you can install 0.46.0-rc.2: npm install [email protected].

[IgorVanian]

Did npm install --save [email protected] and even react-native upgrade

Still the same error...

EDIT: Happens on Windows only though (OSX <3)

[kabala]

I still got the same error on Windows, I did the upgrade but the problem persits. I was cautious about another reasons that show the same error. I cheched all the connections and cleaned my project with gradlew clean.

[jeanlauliac]

@IgorVanian , @kabala, do you use watchman? Since it happens only on Windows it _might_ be related to https://github.com/facebook/metro-bundler/issues/2. If you don't use watchman, then it could be another issue with how we handle paths. Does the problem go away temporarily when using --reset-cache?

[IgorVanian]

@jeanlauliac Yes, I do use watchman, I guess you're right about the issue. --reset-cache doesn't help.

[tronin]

I have the same problem, but npm cache clean and npm run start --reset-cache always help me

upd:

"react": "~16.0.0-alpha.6",
"react-native": "0.45.0",

[jeanlauliac]

@tronin to get the fix you have to upgrade to react-native 0.45.1, see hramos' post above.

@IgorVanian for the time being I think you can downgrade watchman as a workaround, or disable it if possible (I think there's an option? I'd need to check). Of course we'd like to fix that in packager itself.

[IgorVanian]

@jeanlauliac Disabling it is not an option because I get EMFILE, too many open files error since my project is somehow big for Windows (seriously, roughly 3k files including node_modules and Windows can't handle it...)

[kabala]

You're totally right, I deleted watchman from global packages and now it's working!

[Mirodil]

npm start -- --reset-cache does not help at all
react-native-cli: 2.0.1
react-native: 0.45.1

[hmatijevic]

I have the same problem on android & windows 10 in last 2 days.
Also tried with npm start -- --reset-cache and a lot of other commands (from comments) but does't help.

In my case the problem was with watchman (on windows 10), as the @jeanlauliac mentioned. I removed it and it works good now. It's little bit tricky, cause the first you need to do is open terminal, run couple times watchman watch-del-all, then watchman shutdown-server, then Ctrl+Alt+Del, and remove watchman.exe from processes. Then delete your C:\Users\yourusername\AppData\Local\Watchman directory, and remove it from PATH environment variables on windows.

I hope this will help someone.

npm: 4.6.1
node: v8.1.4
react-native-cli: 2.0.1
react-native: 0.44.2

[hramos]

Also worth noting this should be fixed in 45.

[jeanlauliac]

For the record the watchman problem has separate root causes. It should be fixed in future versions of the bundler/RN.

[tudor2it]

watchman really killed me :(
Thank you hmatijevic for your post!

[imapolaris]

thank for @hmatijevic , this solves the problem

[IgorVanian]

I'm kinda stuck on this because without watchman I get the EMFILE: too many open files and with watchman I get this error :/ Don't know how to proceed...

[baba43]

I have created a brand new App with create-react-native-app (ejected) and now I'm stuck with this errors. First the bundler stopped working at all with some errors from watchman. After upgrading watchman to latest version (Windows 4.9.0) I get this error. React-Native version is 0.46.4.

[ajaysaini-sgvu]

I updated react native to .45.1 and got stuck with this error. I tried above suggested solutions npm run start --reset-cache and delete watchman. I don't have watchman installed on my machine. These solutions didn't work for me. :( cc @hmatijevic @hramos

Does anyone know work around for this issue ? Below are the details of my react native and node version:

react-native-cli: 2.0.1
react-native: 0.45.1
npm -v 4.2.0
node -v v7.10.0

[dhramijo]

@hmatijevic thank you for the suggestions, it resolved my issue.

[avhari]

@hmatijevic thank you for the suggestions, it resolved my issue. Thanks a lot.

[batorskik]

@hmatijevic you saved my life. I've been struggling against it for days/weeks.

[vmahishi]

Tried all the above solutions, but none worked. Although it works perfectly on ios. I do react-native run-ios and the app launches in an ios simulator perfectly well but on android it fails every time.
I have the following packages,
"react": "16.0.0-alpha.12",
"react-native": "0.48.4",
react-native-cli: "2.0.1"
node : v8.1.4
npm : 5.0.3

Any help would be much appreciated.
Thanks,
Vikram

[jonrh]

Got this error after upgrading to React Native v0.49.0. It seems that in v0.49.0 the app entry is now a single index.js file instead of the two index.ios.js and index.android.js. At the time of writing v0.49 release notes haven't been published but starting a new project:

react-native init AwesomeProject --version 0.49.0

revealed a single index.js file. Seems to work for me so far.

[nicovak]

For v0.49.0: https://github.com/facebook/react-native/commit/6e99e314b232c315628c31f97a865c17c071ad23

[IgorVanian]

It's still looking for index.*.js files even after 0.49.1 update. Any tweaks I need to apply?

[victoriafrench]

@IgorVanian, In 49 the entry must be index.js instead of having two different files (index.android.js & index.ios.js). It should have been listed as a breaking change.

Thanks @nicovak for the link explaining it.

[hramos]

From the release notes, under Breaking Changes:

[pacozaa]

I still have this problem in 0.49. How to solve it?

[tavisca-prathod]

@pacozaa read comment by @victoriafrench

[pacozaa]

@tavisca-prathod Thank you.

I am not quite sure what they mean above. My project works find with Expo but can not run on real device.

I have one app/index.js in the project.

[pacozaa]

Problem solve by delete iOS an android folder then rebuild it using react-native-git-upgrade

[matthewfbenjamin]

My react native is at version 0.49.5 and I'm still having this issue. None of the above temporary solutions worked for me either.

EDIT: My issue was due to another module I was using to throw another error.

[udarts]

For me the same running react-native: 0.49.5 and still having the same issue with android. ios is fine.

[pacozaa]

@udarts Did you try my solution?

[Yoruba]

I had the same problem after upgrading from 46.x to 49.x even after creating a new index.js and change the

AppDelegate.m
jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];

and MainApplication.java
@Override protected String getJSMainModuleName() { return "index"; }
Solution was
Uninstall the app from the emulator
Clean the build
Build the app again (react-native run-android)
After that the app was installed on the emulator and did work again.

[mommyslab]

guys I tried npm start and npm run start --reset-cache but even I get bundler ready written in terminal after writing react-native run-ios my terminal completely freezes :/

[gabrielvcbessa]

@jonrh @hramos Thank you guys!!

[waifo]

I have tried all the above steps still i am facing this issue

[waifo]

i am getting error "Cannot find entry file 'index.js' in any of the roots:" while creating main.jsbundle

[jwrubel]

@waifo do you have index.js in the root of your project, or only index.ios.js and index.android.js`? In my case I upgraded from several releases back and had the same error you are seeing - The answer here worked for me.

[waifo]

I have only index.js file

[brunck]

I'm facing this issue running react-native 0.47.1. The path given in the [] is the root of the react native project I'm running the packager inside.

[DmytroLapshyn]

Faced (and managed to troubleshoot) this with react-native 0.51.0 and TypeScript. In my case, the root cause was an improperly implemented watch script that was removing all the .js files and doing a full recompile. As long as the full recompile was happening in parallel with metro bundler collating its dependency tree, it led to the error.

Doing the recompile before executing react-native run-android and a non-destructive watch script in parallel fixed the issue for me.

[waifo]

installed react-native-cli and this command worked for me
react-native bundle --platform ios --dev false --entry-file index.js --bundle-output ios/main.jsbundle

[truongtq2506]

Hi everyone! Maybe I can help you
If you have the same problem you can search:
-https://stackoverflow.com/questions/38701115/windows-android-react-native-server-crashes-very-often/43217182#43217182
ERROR: KyANon\RNFBSDK.......\node_modulesreact-native-fbsdkandroid\build\generated\source\buildConfig\release\com\facebook\reactnat
iveandroidsdk'

=> cd android -> gradlew clean -> cd.. -> react-native start (npm start)

And about we can "Cannot find entry file index.ios.js [index.android.js] in any of the roots":

https://user-images.githubusercontent.com/15075926/34285093-8ba05c2a-e709-11e7-89df-8310ba98c81e.PNG

Create file "index.android.js" by copy "index.j"s and rename to "index.android.js"

Because as Mr. Hramos talked: "From the release notes, under Breaking Changes:"
https://user-images.githubusercontent.com/165856/31623607-cc69304a-b254-11e7-8fd3-cb81c897ca41.png
We miss two files index.android.js and index.ios.js so we can copy to create that files.(In this case I just copy and rename not refactor name. you can delete indext.js)

So goodbye and good luck for you!

[udarts]

truongtq2506,

And about we can "Cannot find entry file index.ios.js [index.android.js] in any of the roots":
https://user-images.githubusercontent.com/15075926/34285093-8ba05c2a-e709-11e7-89df-8310ba98c81e.PNG
Create file "index.android.js" by copy "index.j"s and rename to "index.android.js"
Because as Mr. Hramos talked: "From the release notes, under Breaking Changes:"
https://user-images.githubusercontent.com/165856/31623607-cc69304a-b254-11e7-8fd3-cb81c897ca41.png
We miss two files index.android.js and index.ios.js so we can copy to create that files.(In this case I just copy and rename not refactor name. you can delete indext.js)

The fix to this issue is not to recreate the index.android.js and index.ios.js, we just got rid of the double index files. I had the same issue and fixed it by making a copy of my existing files and then remove all and create a new react native project, then past my code into the new project.

Since that time my app is running without issues.

Cheers

[waoywssy]

After I upgraded my test program, I had the same issue. But I fixed it by adding the 'root' attribute, to the configuration file 'build.gradle' of module 'app'. The root directory can't be absolute path.

project.ext.react = [
entryFile: "index.android.js",
// the root of your project, i.e. where "package.json" lives
root: "../../",
]

[truongtq2506]

Dear Ms/Mr Waoywssy,

I so happy when you ask me about question. But I can't help you because
this problem not clear.
I'm so sorry.!

Thanks and best regard!
Mr Truong

Truong Tran Quang

Software Developer

Email: [email protected]
Mobile: [phone] <%2B81-90-8732-0462>

skypeID: truong.tq2

On 27 December 2017 at 09:53, waoywssy [e-mail] wrote:

After I upgraded my test program, I had the same issue. But I fixed it by
adding the 'root' attribute, to the configuration file 'build.gradle' of
module 'app'. The root directory can't be absolute path.

project.ext.react = [
entryFile: "index.android.js",
// the root of your project, i.e. where "package.json" lives
root: "../../",
]

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/facebook/react-native/issues/14246#issuecomment-354041889,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AOYKVuFgnDk5DGXUbopgIYEH_39-yo4Yks5tEbEjgaJpZM4NplvW
.

[SantoshSah]

This issue is still in version 0.52.2. Any permanent solution? It is very sad that someone can run blank RN project.

[davebro]

Still in version 0.53.0.

[mojotti]

Hey there. If you created your app with CRNA (create-react-native-app), make sure you have ejected your app first. More info can be found from here: https://github.com/react-community/create-react-native-app/blob/master/EJECTING.md

[vitorll]

Still an issue with

react-native -v
react-native-cli: 2.0.1
react-native: 0.54.2

Any help is welcome

[huntharo]

@vitorll - Try this.

The issue has inconsistently happened for my colleagues, who all followed my instructions for setting up an RN dev env, but not for me. What would happen for them is their initial build would work, particularly if iOS or Android native files were being built from scratch but the subsequent builds would result in the dreaded error from the bundler:

error: bundling failed: NotFoundError: Cannot find entry file artifacts/index.js in any of the roots

Today we noticed that 'which watchman' returns nothing for them but returned an instance of watchman for me. When I setup my dev env a year ago I installed watchman but did not include it in my instructions for the setup of their dev environments.

Installing watchman (and ensuring it is in the path) took care of this for them. On Mac you can install via 'brew install watchman' if using HomeBrew.

Could you please try this and confirm here if this resolves your issue?

[tsabs]

I have the similar issue on android. To solve it I juste create manualy the index.android.js ( here for you index.ios.js ). And add this into it :
`import { AppRegistry } from 'react-native';
import App from './App';

AppRegistry.registerComponent('LtcNice', () => App);`

After that I run manualy react-native start and react-native run-android and it's works. I hope it's gonna to be the same for you.

[MSchmidt]

If you are updating from an old project you need to make sure the correct files are loaded from native code to adopt the new single file entry point.

// android/app/src/main/java/<yourPackage>/MainApplication.java

private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
  //...
  @Override
  protected String getJSMainModuleName() {
    return "index";
  }
};

// ios/<project>/AppDelegate.m

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  NSURL *jsCodeLocation;

  jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
  //...
}

[EvHaus]

I've also started getting:

Bundler returns `NotFoundError: Cannot find entry file index.js in any of the roots:

after upgrading to [email protected].

To fix this, I had to remove my index.ios.js and index.android.js files and create a single index.js file in the root of my project. Looks like this default behavior changed in react-native, but I didn't see anything mentioning this in the release notes.

Hope this helps someone else looking for the fix.