failed to load bundle localhost 8081 index.bundle platform=ios cannot find entry file index.js in any of the roots - react-native

For about the last 24 hours I decided to take my react native project off expo. So I ejected it and started to doing the proper troubleshooting to run my app using react-native run-ios. I have managed to make my application's build succeed via Xcode however when the application runs I constantly get an ERROR. I noticed within my react native file I don't have an index.js. Not really sure why not and how to make one. I did try running react-native init, however, that just made my build fail and I had to go through a whole process to make it work again. Any help would be very much appreciated.
NOTE: I am not able to embed images at my level. So, I do apologize for the link
package.json + look at my files

Add an index.js in your root with the following:
import { AppRegistry } from 'react-native';
import App from './App';
AppRegistry.registerComponent('YourAppName', () => App);

Related

React native project crashing with Redux Toolkit

I'm using an Expo Bare Workflow setup with my React Native App.
I followed this guide EXACTLY https://redux-toolkit.js.org/tutorials/quick-start copy pasted everything.
Imported
import { store } from "./src/main/redux/store";
import { Provider } from "react-redux";
on my App.js but it crashes when I build the app for Expo Go testing using eas update. If I remove those two imports, the app works fine.
I've followed the quickstart guide exactly, so for the code you can refer to the quick start guide as it might be redundant if I still post it here.
There's no error message from the App because it crashes on startup. I do get one from xcode saying com.facebook.ABI46_0_0React.ExceptionsManagerQueue and the rest are some obscure messages

index.js file is not generated when eject my expo react-native app

I'm new to React Native and expo. I created a new project with that command
expo init my-app then I opened my project with VSCode and run that command
expo eject to eject to regular React Native app, after ejecting process is completed, I found that my project folder does not contain the index.js file, while the tutorial that I was following did the same steps I did before and the instructor got that index.js file?
What's wrong in my steps? Anyone can clear the whole idea?
Yes, this happened with me too.
expo eject is not creating index.js
So, create index.js manually and add the following code to the file. It should work perfectly.
import { AppRegistry } from 'react-native';
import App from './App';
AppRegistry.registerComponent('your_app_name_here', () => App);

react-native app.js index.js

I am new to application development with React-native. While creating project with the command react-native init appname the index.js file is also created inside the project folder. Today, I have learned that there is a better way than installing android emulator to test react-native projects which is Expo. To create expo projects I need to create react-native project with create-react-native-app appname command. However, the index.js file is not created while creating project with this way. Even though, I manually created the index.js file, it does not work as it should.
One more question: What is aim of App.js and index.js?
React Native: (react-native init)
A little bit of history. In earlier versions of React Native, separate index.js files were required for iOS and Android. App.js was meant to contain the top level cross platform code for your app. Then index.ios.js and index.android.js would import the cross platform code from App.js and register/link it with the underlying native modules. That allowed you to place top-level cross platform code in one file while placing top-level platform specific code in other files. The index.*.js files were the connectors that wired up the Javascript to native Android or iOS code.
As React Native evolved to remove the platform specific index files, they kept the paradigm of having the top-level Javascript in App.js and using index.js to wire that code to the native modules.
Bottom Line
As a practical matter, don't touch index.js. Make your top-level modifications in App.js.
Expo: (create-react-native-app)
Expo operates a little differently than baseline React Native. You will notice that an Expo project does not contain the ios or android directories. That is because there is no native code associated with an Expo project. All of the native code is contained in the Expo SDK. Since there is no native code to wire up to your Javascript, you do not need an index.js file.
Bottom Line
You should not need an index.js file in an Expo project. If your Expo project is not working, there is likely another problem that needs to be resolved.

React Native latest upgraded version issues (app directory)

I am a beginner at React Native and have begun to take some time off to work on my new app project.  I have noticed that there is a lot of difference with RN old and the new version. One is the combination index.js and App.js instead of index.android.js & index.ios.js. 
The other is the new folder structure after react-native init-ios/android is completely changed. Following the standard installation guidelines and creating RN project, I do not see App directory created at all (the only folders are tests, android, iOS, node_modules.
Have you seen this after the latest upgrade? How do I rectify this?  Any suggestions will be great.
Create your own app directory, put all your logic in there.
Import the root file into App.js in root folder.
$ react-native run-android or $ react-native run-ios` and app should run as expected.
You can use create-reactive-app with expo if don't wish to use the react-native-cli. See react-native docs, getting started for more information.

EventEmitter not resolved on iOS if used in external module

So, I've been spending quite some time on this issue without success :( Time to turn to the SO community ;)
Here is the situation :
I am working on a react-native module that makes use of the EventEmitter.js class from react-native.
I am facing an issue when using this module from a react-native application. When I import the module in let's say the root index.ios.js and launch the app, I get the red screen saying that it is Unable to resolve module EventEmitter.
What is strange is that in onny happens on iOS, not Android, and only if the require is done from the "external" module. If done directly from the index.ios.js of the react-native app itself, then there is no issue, it correctly finds EventEmitter.
To make it clearer ...
If I create a new react-native app from scratch through react-native init and then in the index.android.js and index.ios.js just add the line
const EventEmitter = require('EventEmitter');
Then it's fine for both iOS and Android, I am able to run the app and create bundles.
However if I put this same line in an external node/npm module that I then import in my index.ios.js or index.android.js, when I run the app again, it will fail for ios but work for android. Creating bundle show same problem where it fails to build the iOS bundle but succeed to create the Android one.
There is something that I don't understand here. Any help will be appreciated, thanks !