Skip to main content
To use Rive with Expo, you’ll need to install the rive-react-native package. Because this package contains custom native code, it’s not compatible with Expo Go. Instead, you’ll need to use a development build, which gives you full access to native modules.
Development builds are the recommended setup for production apps.
This guide will walk you through integrating Rive into your Expo project, including installing dependencies, configuring your build, and testing your animations.

​
Initial Setup

If you don’t already have a project, create a new Expo app: 
npx create-expo-app MyRiveApp
Install the Expo development client: 
npx expo install expo-dev-client
Then install the Rive package: 
npx expo install rive-react-native

​
iOS Minimum Version

Rive for iOS requires a minimum deployment target of 14.0. If you’re using Expo SDK 52 or later, you can skip this step as 14.0 is already the default. If you’re using an older SDK, you’ll need to update your iOS deployment target manually or via configuration. Continuous Native Generation (CNG) simplifies app maintenance and configuration by automatically generating your iOS and Android native projects using Prebuild. If you’re using CNG, you can set the minimum iOS deployment target directly in your app.json or app.config.js: 
{
  "expo": {
    "plugins": [
      [
        "expo-build-properties",
        {
          "ios": {
            "deploymentTarget": "14.0"
          }
        }
      ]
    ]
  }
}

​
Option 2: Manual Configuration

If you’re not using Prebuild, update the target directly in your ios/Podfile: 
platform :ios, podfile_properties['ios.deploymentTarget'] || '14.0'

​
Creating a Development Build

To run your app with the Rive runtime, you’ll need to create a development build. Since there are several ways to do this, refer to the Expo development builds guide to choose the method that best suits your needs.

​
Running Your App

Once you’ve created a development build and installed it on your device or simulator, start your app with: 
npx expo start
You can use the following component to test Rive: 
import { View } from 'react-native';
import Rive from 'rive-react-native';

export default function RiveDemo() {
  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
      <Rive
        url="https://public.rive.app/community/runtime-files/2195-4346-avatar-pack-use-case.riv"
        artboardName="Avatar 1"
        stateMachineName="avatar"
        style={{ width: 400, height: 400 }}
      />
    </View>
  );
}
If you encounter this error: Invariant Violation: requireNativeComponent: "RiveReactNativeView" was not found in the UIManager, it usually means the app is running in Expo Go. Press s in your terminal and select the development build instead.

​
Adding Local Assets

The example above loads a .riv file from a remote URL. To use local .riv files, they must be bundled into your native build. See Loading in Rive Files for instructions on working with local assets.