Expo is an open-source framework for apps that run natively on Android, iOS, and the web. Expo brings together the best of mobile and the web and enables many important features for building and scaling an app.

Expo is a set of tools built on top of React Native. The Nx Plugin for Expo contains generators for managing Expo applications and libraries within an Nx workspace.

Setting Up Expo

To create a new workspace with Expo, run the following command:

โฏ

npx create-nx-workspace@latest --preset=expo --appName=your-app-name

Installation

Keep Nx Package Versions In Sync

Make sure to install the @nx/expo version that matches the version of nx in your repository. If the version numbers get out of sync, you can encounter some difficult to debug errors. You can fix Nx version mismatches with this recipe.

In any Nx workspace, you can install @nx/expo by running the following command:

โฏ

nx add @nx/expo

This will install the correct version of @nx/expo.

How @nx/expo Infers Tasks

The @nx/expo plugin will create a task for any project that has an app configuration file present. Any of the following files will be recognized as an app configuration file:

  • app.config.js
  • app.json

In the app config file, it needs to have key expo:

1{ 2 "expo": { 3 "name": "MyProject", 4 "slug": "my-project" 5 } 6} 7

View Inferred Tasks

To view inferred tasks for a project, open the project details view in Nx Console or run nx show project my-project --web in the command line.

@nx/expo Configuration

The @nx/expo/plugin is configured in the plugins array in nx.json.

nx.json
1{ 2 "plugins": [ 3 { 4 "plugin": "@nx/expo/plugin", 5 "options": { 6 "startTargetName": "start", 7 "serveTargetName": "serve", 8 "runIosTargetName": "run-ios", 9 "runAndroidTargetName": "run-android", 10 "exportTargetName": "export", 11 "prebuildTargetName": "prebuild", 12 "installTargetName": "install", 13 "buildTargetName": "build", 14 "submitTargetName": "submit" 15 } 16 } 17 ] 18} 19

Once a Expo configuration file has been identified, the targets are created with the name you specify under startTargetName, serveTargetName, runIosTargetName, runAndroidTargetname, exportTargetName, prebuildTargetName, installTargetName, buildTargetName or submitTargetName in the nx.json plugins array. The default names for the inferred targets are start, serve, run-ios, run-anroid, export, prebuild, install, build and submit.