Prepping Ignite for EAS Build
This guide will teach you how to set up an Expo development build which prepares your project for native code via Config Plugins, but keeps you in Expo's managed workflow.
Appetizer
Start with a fresh Ignite app, but choose the prebuild
workflow:
npx ignite-cli@latest new PizzaApp --workflow=prebuild --yes
You'll also need eas-cli
globally installed and and an Expo account if you don't already have one.
npm install -g eas-cli
Optional: You can use EAS builds for free, however there is a queue time to wait for your build. It is possible to build locally, you'll need a couple of other dependencies installed for proper iOS and Android builds (if you can already build iOS/Android natively, you're probably good to go!)
iOS
brew install cocoapods fastlane
Android
SDK and NDK
Steps
1. Project Setup
From within your project directory, run the following:
yarn add expo-dev-client
Create or link an EAS project.
eas init
You'll be asked to select your EAS account if you're linked to multiple and if you'd like to create a new project. Afterwards, you'll see a warning like this:
Warning: Your project uses dynamic app configuration, and the EAS project ID can't automatically be added to it.
https://docs.expo.dev/workflow/configuration/#dynamic-configuration-with-appconfigjs
To complete the setup process, set "extra.eas.projectId" in your app.config.ts or app.json:
{
"expo": {
"extra": {
"eas": {
"projectId": "...id here..."
}
}
}
}
Simply open app.json
and add the extra
key somewhere under the expo
key in that file.
Configure the project to support EAS Build.
eas build:configure
2. Build Profile
Ignite 9 comes with some build profiles already set up for you. You can view these in eas.json
to configure them further. Here's an example:
{
"cli": {
"version": ">= 0.60.0"
},
"build": {
"development": {
"developmentClient": true,
"distribution": "internal"
},
"preview": {
"developmentClient": true,
"ios": {
"simulator": true
}
},
"production": {}
},
"submit": {
"production": {}
}
}
3. Run the Build!
Using EAS build servers
eas build --profile preview
Once complete, you can download the Android apk
or iOS tar
file.
Build Locally
eas build --profile preview --local
Your app will be saved in the root directory unless you specify the desired directory with the environment variable EAS_LOCAL_BUILD_ARTIFACTS_DIR
, for example:
EAS_LOCAL_BUILD_ARTIFACTS_DIR=build eas build --profile preview --local
This will save your *.apk
or *.tar.gz
(containing the .app
) in the [project-dir]/build/
directory.
4. Run the Development Client
With the builds complete, let's add them to your emulator or simulator.
iOS
tar zxvf build/build-*.tar.gz -C build/
(adapt this command depending on where you saved it to)- Drag the
PizzaApp.app
onto your iOS simulator
Android
Drag the APK onto your emulator or install it on a device (making sure your settings are appropriate for "Install unknown apps")
You can now develop locally like you normally would with Expo Go, with one last adjustment to the start
script.
In package.json
modify the start script to use the expo-dev-client
package.
--"start": "expo start"
++"start": "expo start --dev-client"
Run yarn start
in your terminal so metro starts up. Follow the Expo CLI to boot up either the Android or iOS app. You'll notice Expo Go has not launched in this case, but something that looks very similar (you can still shake the device for developer menu, etc).