HomeGuidesReferenceLearn
ArchiveExpo SnackDiscord and ForumsNewsletter

Use Flipper

A guide on installing and configuring Flipper for debugging an Expo project.

React Native no longer recommends Flipper (RFC0641). Features from Flipper, such as React Developer Tools and the network inspector, are available directly through Expo CLI in SDK 49 and greater. Learn more.

Flipper is a platform tool for debugging React Native projects on an emulator/simulator or a physical device. It supports projects running on Android and iOS and is available as a desktop application on macOS, Windows, and Linux.

It offers various features such as a device log viewer, interactive native layout inspector, network inspector, local database inspector, crash reporter, and more. You can add more plugins available in the Flipper desktop app.

Prerequisites

Before you get started, make sure you have the following installed on your computer:

  • Flipper desktop app
  • EAS CLI installed and logged in to your Expo account
  • Debugging your Expo projects with Flipper requires creating a development build of your project

1

Run setup doctor

Open the Flipper desktop app and click the Setup Doctor button from the bottom left menu.

If any dependencies are missing, follow the instructions provided by Flipper to install them.

2

Install expo-dev-client

Since Flipper requires native code, you'll need to create a development build. To set it up, install the expo-dev-client library:

Terminal
- npx expo install expo-dev-client

3

Add expo-build-properties

The Expo SDK uses the bundled version of Flipper from react-native. For Android, Flipper is enabled by default.

For iOS, you need to install expo-build-properties and enable Flipper in the plugin configuration:

Terminal
- npx expo install expo-build-properties

Installing the package adds the expo-build-properties plugin to your project's app.json. To enable Flipper, add the ios.flipper property and set it to true in the plugin configuration:

app.json
{
  "plugins": [
    [
      "expo-build-properties",
      {
        "ios": {
          "flipper": true
        }
      }
    ]
  ]
}

4

Configure and install a development build

To configure and install a development build, follow the instructions below:

  • Android Emulator or iOS Simulator
  • Physical device

5

Run the development server

After installing the build, run the following command to start a development server:

Terminal
# For SDK 49 and higher
- npx expo start

# For SDK 48 and lower
- npx expo start --dev-client

Once the development server is running, open the Flipper desktop app and select your device or simulator under App Inspect:

Limitations

If a third-party library uses "useFrameworks": "static" for iOS in your project, integrating Flipper will not work since it is incompatible. For more information, see the notice on the compatibility issue in the expo-community-flipper GitHub repository.

More

To learn more about the tool, see React Native support in Flipper documentation.