React Native SDK Installation
Important
- React Native versions earlier than 0.64 are not supported.
- The New React Native Architecture is not supported yet.
- The Clarity package depends on native code to run, therefore you've to ship a new build after integrating the package.
- Expo Go does not support plugins that require native code to execute. Hence, Clarity SDK will not operate if you're running through Expo GO. To run the SDK locally, you can use the EAS Build system.
- Currently, React Native package offers full support for Android. iOS functionality is currently in an experimental phase and requires enabling a feature flag.
ReactNative plugin allows integrating Clarity with your application.
Installation
Step 1
Run this command to add the package.
npm install react-native-clarity
Step 2
Add this code to start Clarity.
import { initialize } from 'react-native-clarity';
initialize("<ProjectId>");
Refer to the available APIs and how to use them here.
Note
For iOS, data collection and upload is currently an experimental feature. To activate it, set the enableIOS_experimental config to true during initialization.
Step 3
After integrating Clarity with your application, if you'd like to test it on a device or an emulator, ensure the following steps:
- Your device/emulator is connected to the internet.
- Your device/emulator OS version is within the supported range:
- Android: 29-34 inclusive.
- iOS: 15-18 inclusive.
- Your first run might require setting the log level to Verbose to obtain the Clarity logs. These logs can help identify initialization errors, if any.
Then give it around 2 hours for the data to show up in your Clarity project on the Clarity website.
Known Issues
- For
react-native-svgUsers: A known bug inreact-native-svgversion 13.x that affects user interaction and playback when used with Clarity. We recommend upgrading toreact-native-svgversion 14 or later for proper behavior and compatibility with Clarity.
FAQ
For more answers, refer to FAQ.