Skip to main content

How to work with Expo Bare Workflow

· 6 min read
Robin Tubungbanua

We will go through how to run and debug Android and iOS on an Expo Bare Workflow Locally through Emulator and Physical Device, with Expo Go, and with EAS Build.

This blog assumes you have already installed the usual things you need to run expo apps which are expo-cli, yarn, and node.js

Note node version lts/gallium worked best for me.

First Things First...​

If you want to run your custom code (custom iOS/Android code) locally, you need to make sure your environment is set up for it. To determine this, you can run

npx @react-native-community/cli doctor

For more information on how this command works, check this blog out

The doctor should automatically fix environment issues for you and install whatever it needs to install, but in the event it doesn't, you can install each manually yourself.

  • XCode Required for building and installing your app on iOS
  • CocoaPods Required for installing iOS dependencies
  • ios-deploy Required for installing your app on a physical device with the CLI
  • Watchman Used for watching changes in the filesystem when in development mode

I won't go through the specifics on how to install each because they are all google-able and well documented.

For iOS, There's no way to locally build and run without a Mac. If you don't have one, you can use MacInCloud which lets you rent Mac.

Cocoapods, Watchman, and ios-deploy can all be installed using brew.

Brew Install for iOS
brew install ios-deploy
brew install watchman
brew install cocoapods

You can also install Cocoapods from your default ruby available on macOS

sudo gem install cocoapods

After CLI doctor is successful, we can now start running our Expo Bare Workflow app.

Running Expo Bare Workflow Locally​

After you have set up your environment as mentioned above, you can run these commands inside your project's root folder.

Expo Run Command for iOS
expo run:ios

These commands will create the /ios and /android folders, install dependencies, build your project and deploy them to either a simulator or a physical device depending on what's available.

If you are coming from a Managed Workflow, then it will eject iOS/Android when you run these commands. More information about these commands is in the Expo Up and Running docs.

Running on an Emulator​

if you take a look at your project folder, you will notice that an ios/ or android/ folder has been created.

You can open these folders in XCode or Android Studio, and then create your emulators or select them so when you run expo run:ios/android it will build for the emulator selected.

Running on a Physical Device​

You can use the QR Code that will be generated when metro is running after expo run. If you're having problems with that, you can also set it to run on a physical device by connecting your device via USB, and setting it up for development. Then run

expo run:ios -d 'device uuid'

Replace 'device uuid' with the device uuid that you want to deploy your app to.

To get your device uuid run this in the terminal.

xcrun xctrace list devices

More info on getting device uuid

Additional Considerations for Running on Physical Devices​

For iOS You also need to make sure it is part of the provisioning profile of your Apple Team Account. I also had a problem with main.jsbundle being empty. So following the stack overflow issue, I added this to our package.json scripts

package.json
 "build:ios-dev": "react-native bundle --entry-file='index.js' --bundle-output='./ios/main.jsbundle' --dev=true --platform='ios'"

This will allow us to populate main.jsbundle using this command yarn run build:ios-dev

When the jsbundle has been successfully populated, you can then run this command to finally run for an iOS device expo run:ios -d --configuration development.

Installing Dev Client​

Expo Development Installation documentation will guide you through how to install expo-dev-client onto your project. This will give you some quality of life improvements during development.

Running Expo Bare Workflow with Expo Go​

Despite what this Expo Documentation says, it is possible to run Expo Bare Workflows with Expo Go. The problem is that it won't build the custom code you wrote in your iOS/Android 💩. What this means is that Expo Go would still work, but it would just ignore your custom code. You can read more about why they did this here Using Expo Go With Bare Workflow.

TLDR; If your app isn't too reliant on custom native code, and you just something quick and easy for your shareholders to run, you can still use Expo Go.

Running Expo Bare Workflow with EAS Build​

If you do need to build your projects without having to configure your machine for it locally, you can always use EAS Build. What EAS Build allows you to do is to build your Bare Workflow on Expo Servers instead of on your machine. This allows Windows machines to create builds for iOS.

The Expo Documentation does a good job of going through how to work with EAS Builds step by step, so I'll just list the docs I've used to make it work here.

expo-dev-client

I also installed expo-dev-client before configuring EAS Build. So yea, try each one and tell me about it. Check out the Installing Dev Client section above.

Closing Thoughts​

So this is all I know so far through my journey in Mobile Development using React Native, Expo, and iOS/Android Native code. Feel free to DM me or email me if you have any questions!

I'm also thinking of doing more blogs on different things I couldn't find any blogs for. I run on the need to feel validated by strangers on the internet, and coffee. buy me a ☕️