Expo after detaching might be confusing if you do not know these basics.
Expo after detaching might be confusing, especially if you do not have prior native development experience with Android or iOS apps. Let's discuss some basic concepts of detached Expo apps and how to build production APK or IPA files after we have detached from expo.
If you created your app using the command
expo init then its an "Expo app" and if you used
react-native init then its a react-native-cli app. Official documentation of react native suggests both the ways of creating a React native application.
Bottom line: Expo is easy, fast and gives better development exprience!
When to detach from Expo
If Expo is easy then why to detach and enter the realm of manual dependency management by detaching? That because, Expo is new and constantly improving, a lot of features are present in the current Expo SDK but not all. For example, the major missing feature (according to me and many) from Expo is the ability to run background tasks. The core team of Expo developers is working on this one and this is expected to be available in the next major release.
Development with expo is all fairy-tale until you hit such a requirement which Expo does not support (yet). In that case, you will have to detach from Expo and write native code for Android and iOS separately.
How to detach your app from Expo
exp detach or
With this single command, expo-cli converts your expo app to a detached react-native app with ExpoKit to keep the magic of Expo still intact.
It is recommended that you commit your code before attempting to detach from Expo.
More details and information can be found on the official detaching guide
What happens after you Detach
Luckily, nothing much! Let me list the major things out
- Expo-cli app is now converted to a react-native-cli app
- Two additional directories "ios" and "android" are created
- The previous code works perfectly fine and you can still use Expo components. Thanks to ExpoKit.
Detaching gives you "ios" and "android", two additional folders. These folders contain the native code for your Android and iOS apps. You can open the "android" directory in Android studio and the "ios" directory in Xcode and add native features into your app.
You're in luck! Because detaching does not mean you now have to write each code twice in android and ios in native language. You can still write JS code for features that are supported in the expo or react native client.
I think detaching gives your app superpowers. Because
- Now you can use "react-native-cli" modules in your project
- You can keep using Expo features
- You can write native code in Android Studio and Xcode.
Developing after detaching expo app
Go ahead make your changes in the native code and run the app using the "Build and run" feature of Android studio or Xcode as you would run any native app.
Run expo development server using the command:
You need to have the expo development server running for the APK or IPA to work. That is because Expo pulls the JS code from the development server. Remember you can still make changes in the JS code and it will work as expected.
The only thing that changes from your previous workflow is that now you have to install the app from Xcode or Android.
Publishing after detaching expo app
Once you are done with the development its time to build an APK or IPA from the detached expo app.
Before generating the production app, make sure you publish the JS changes to the expo server so that the users can get the JS code.
- Run command:
- Generate APK or IPA from Android studio or Xcode
Now you can distribute the generate application files. Happy coding!