Working with Expo CLI Commands

1. Starting Development Server

Command	Description	Options
expo start	Starts the Expo development server and opens the Expo DevTools in your browser.	`-c` to clear the cache `--offline` to run in offline mode `-p` to specify a port
expo start --web	Starts the development server with web support enabled.	`--web` to enable web mode `-p` to specify a port
expo start --android	Starts the development server and opens the app on an Android emulator or device.	`--android` to target Android `-p` to specify a port
expo start --ios	Starts the development server and opens the app on an iOS simulator or device.	`--ios` to target iOS `-p` to specify a port

Example: Starting the Development Server

expo start

Example: Starting the Development Server with Web Support

expo start --web

Example: Starting the Development Server for Android

expo start --android

Example: Starting the Development Server for iOS

expo start --ios

Note: The expo start command will automatically open the Expo DevTools in your default browser. You can scan the QR code with the Expo Go app to preview your project on a physical device.

2. Running on iOS Simulator

Command	Description	Notes
expo start	Starts the Expo development server	Must be run from project root directory
expo start --ios	Starts the Expo development server and opens iOS simulator	Requires Xcode and iOS Simulator to be installed
expo start --simulator	Starts the Expo development server and opens default simulator	Can be used with --ios or --android flags

Example: Running on iOS Simulator

expo start --ios

Note: Ensure that Xcode and iOS Simulator are installed and configured correctly on your machine before running this command.

3. Running on Android Emulator

Command	Description	Notes
expo start --android	Starts the Expo development server and opens the app in an Android emulator	Requires an Android emulator to be running or an Android device connected via USB
expo start --android --offline	Starts the app in offline mode on Android	Useful when you don't have internet access but want to test the app

Example: Running on Android Emulator

expo start --android

Note: Make sure your Android emulator is running before executing the command.

4. Running on Web

Command	Description	Notes
expo start --web	Starts the development server and opens the app in a web browser	Uses React Native Web to render the app in the browser
expo start --web --host localhost	Starts the development server with a specific host for web	Useful for local testing or when using custom domains
expo start --web --port 3000	Starts the development server on a specific port for web	Defaults to port 19006 if not specified

Example: Running on Web

expo start --web

Note: The web platform is built on React Native Web, which supports most React Native APIs but has some differences in behavior and styling.

5. Clearing Metro Cache

Example: Clearing Metro Cache

expo start --clear

Command	Description	Notes
expo start --clear	Clears the Metro bundler cache and restarts the development server	Useful when experiencing build issues or stale asset errors
expo start --cache	Clears the Metro cache without restarting the server	Alternative to full reset, preserves running dev server

Note: Clearing the cache may take a few moments as it removes all previously cached assets and rebuilds them from scratch.

6. Installing Packages

Command	Description	Notes
expo install	Installs a package and its dependencies	Automatically handles platform-specific dependencies
expo install --save-dev	Installs a package as a development dependency	Used for tools like linters or testing libraries
expo install --save-exact	Installs a package with exact version	Ensures reproducible builds across environments

Example: Installing a Package

expo install react-native-svg

Example: Installing a Development Dependency

expo install --save-dev eslint

Note: Expo automatically resolves platform-specific versions of packages when using expo install. For example, react-native-svg will install the appropriate version for iOS and Android.

Warning: Avoid using npm install or yarn add directly in an Expo project. These can cause issues with platform-specific dependencies and may not work correctly with Expo's managed workflow.

7. Running Prebuild

The prebuild command in Expo CLI is used to generate native project files (like android/ and ios/ folders) from your Expo project configuration. It's a critical step when you want to customize native behavior or use native plugins that aren't supported by Expo Go.

Example: Running prebuild

expo prebuild

This command will:

Generate native project files based on your app.json or app.config.js.
Install native dependencies specified in your project.
Apply any configured plugins or modifications to the native project structure.

Option	Values	Description
--platform	`all`, `ios`, `android`	Specify the platform to prebuild for. Default is `all`.
--clean	`true`, `false`	If set to `true`, removes the existing native project files before generating new ones.
--config	path to config file	Specify a custom config file path (e.g., `app.config.js`).
--verbose	`true`, `false`	Enable verbose logging for more detailed output.

Note: Prebuild is required before building for a physical device or submitting to app stores. It ensures that all native dependencies are correctly installed and configured.

Warning: Running prebuild will overwrite any manual changes made to native project files (e.g., android/ or ios/). Always back up your changes before running this command.

Prebuild Workflow

Run expo prebuild to generate native project files.
Make any necessary customizations to the generated native project (e.g., AndroidManifest.xml, Info.plist).
Build or run the native project using the appropriate tools (e.g., expo run:android, expo run:ios).

8. Customizing Project

Example: Customizing project configuration

{
  "expo": {
    "name": "MyCustomApp",
    "slug": "my-custom-app",
    "version": "1.0.0",
    "platforms": [
      "ios",
      "android",
      "web"
    ],
    "ios": {
      "bundleIdentifier": "com.myapp.custom"
    },
    "android": {
      "package": "com.myapp.custom"
    }
  }
}

Property	Description	Default Value
name	Display name of the app	Project directory name
slug	Unique identifier for the app	Project directory name
version	Version of the app	1.0.0
platforms	Platforms to build for	["ios", "android"]
ios.bundleIdentifier	Bundle identifier for iOS	org.expo.$slug
android.package	Package name for Android	org.expo.$slug

Note: Customizing project configuration requires a rebuild to take effect.

9. Ejecting to Bare Workflow

Ejecting from Expo to a bare workflow gives you full control over native dependencies and allows for more advanced customization. This process converts your managed Expo project into a native project with platform-specific configurations.

Command	Description	Notes
expo eject	Initiates the eject process	Must be run in the project root directory

Example: Running the eject command

expo eject

Note: Ejecting is a one-way operation. Once ejected, you cannot return to the managed workflow without rebuilding from scratch.

What Happens During Eject

Creates native project files for iOS and Android
Installs required native dependencies
Updates configuration files (e.g., app.json, package.json)
Removes Expo-specific dependencies and configurations

Warning: Ejecting will remove all Expo-specific configurations and dependencies. You must manually manage native modules and configurations after ejecting.

10. Checking Config

Command	Description	Notes
expo config	Prints the resolved configuration for your project	Uses the `app.json` or `app.config.js` to resolve the configuration
expo config --json	Prints the configuration as JSON	Useful for scripting or debugging configuration issues
expo config --platform ios	Prints the iOS-specific configuration	Allows you to inspect platform-specific settings
expo config --platform android	Prints the Android-specific configuration	Allows you to inspect platform-specific settings

Example: Checking Config

expo config --json

Note: The expo config command resolves your configuration and prints it to the console. It does not modify any files.

11. Diagnosing Issues

Example: Check Expo CLI version

expo --version

Command	Description	Notes
expo diagnostics	Display system information and Expo CLI diagnostics	Helps identify configuration issues or environment problems
expo doctor	Check for common issues in your project	Scans project files and reports potential problems
expo logs	Show logs from the Expo development server	Useful for debugging runtime errors or warnings

Note: Run expo doctor in your project directory to identify common misconfigurations or missing dependencies.

Warning: If expo diagnostics shows outdated versions, update your Expo CLI using npm install -g @expo/cli.

Common Diagnostics Issues

Outdated Expo CLI version
Missing or incorrect project configuration files
Conflicting dependencies in package.json
Network connectivity issues during project initialization

12. Viewing Project Info

Command	Description	Notes
expo diagnostics	Displays diagnostic information about your Expo project and environment	Helpful for debugging and reporting issues
expo config	Prints the project configuration (app.json/app.config.js)	Shows resolved config values after merging
expo prebuild	Generates native project files (iOS, Android)	Useful to verify native setup or when adding new plugins

Example: expo diagnostics

$ expo diagnostics
  Expo CLI 7.10.5
  OS: macOS 13.6
  Node: v18.17.0
  React Native: 0.72.6
  Platforms: iOS, Android, Web

Example: expo config

{
  "expo": {
    "name": "MyApp",
    "slug": "my-app",
    "version": "1.0.0",
    "platforms": ["ios", "android", "web"],
    "ios": {
      "bundleIdentifier": "com.myapp"
    },
    "android": {
      "package": "com.myapp"
    }
  }
}