Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ReactNative Eject Explained

Tags:

react-native

I literally started reading about ReactNative an hour ago and am reading this git readme https://github.com/react-community/create-react-native-app/blob/master/react-native-scripts/template/README.md

Next I googled about it and found this link which seem to be explaining it but not to me novice in web, react, or react-native https://github.com/react-community/create-react-native-app/blob/master/EJECTING.md

Can someone explain to me as if I am 2 years old what is the meaning of eject? I keep hearing term "ejected project" but I cannot wrap my head around it.

like image 826
pixel Avatar asked Jul 22 '17 07:07

pixel


People also ask

What does React Native eject do?

Ejection essentially allows you to take complete control of the build process. It will allow us to add these native libraries from XCode and Android Studio.

What happens when ejecting Expo?

After you eject, all your JS files will stay the same, but we'll additionally create ios and android directories in your project folder. These will contain Xcode and Android Studio projects respectively, and they'll have dependencies on React Native and on Expo's core SDK.


2 Answers

Summary

If you created an app using create-react-native-app MyApp, ejecting your app gets your app to be the same as if you created your project using react-native init MyApp

aka

create-react-native-app MyApp > make changes to app > eject app

is roughly equivalent to

react-native init MyApp > make changes to app

More Details

What's the difference between create-react-native-app MyApp and react-native init MyApp?

Quick start vs. Full scale development

The philosophy behind create-react-native-app is:

  • Minimal "Time to Hello World": Create React Native App should reduce the setup time it takes to try building a mobile app to the absolute minimum, ideally on par with React web development (especially as seen with Create React App).
  • Develop on Your Device: It should be easy to develop on a physical device when you want to test how your app feels and responds to inputs.
  • One Build Tool: If you just want to get started with React Native, you shouldn't need to install Xcode, Android Studio, NDKs, or mess with environment variables.
  • No Lock-In: You can always "eject" to your own build setup if you need to write custom native code or modify how your app is built.

Essentially, create-react-native-app lets you get up and running quickly without having to a do a lot of (or any) configuration. In order to do this, it hides a lot of details from you.

If you want to create a serious app, you need to set up a real development environment. You can do this from scratch by running react-native init <project-name>. If you started with a react native project using create-react-native-app, you can get to this same place by "ejecting" your app

More details from the official documentation about getting started with React Native can be found here.

like image 114
alexdriedger Avatar answered Sep 21 '22 15:09

alexdriedger


My understanding is that when you run the "create-react-native-app" (or "expo init" now) you are basically adding the Expo library on top of React Native.

I think the main reason for using Expo is to get your app up and running quickly. I think the main reason to eject is that eventually you might need to do more complicated customization with native code and need more control, etc. Here is a better explanation of Expo vs React Native CLI to bootstrap your app:

https://levelup.gitconnected.com/expo-vs-react-native-cli-a-guide-to-bootstrapping-new-react-native-apps-6f0fcafee58f

When you eject you are returning to the same state as if you did not use Expo to setup your app (native ios/android projects will be generated, etc.)

Here are a few other links that helped me understand: http://www.reactnativeexpress.com/environment

https://docs.expo.io/versions/latest/expokit/eject/

like image 37
brk Avatar answered Sep 19 '22 15:09

brk