Skip to main content
Version: 2.3.0

SDK Installation (React Native)

Detour provides a React Native SDK (@swmansion/react-native-detour) compatible with Expo and bare React Native projects.

Before installation, make sure your app is created in the Detour Dashboard and you have:

  • appID from API configuration
  • publishable apiKey from API configuration
  • platform integration snippets from App configuration

Install package​

npm install @swmansion/react-native-detour

Install peer dependencies (Expo projects)​

For Expo projects (including prebuild), install peer dependencies with Expo CLI so versions are matched to your Expo SDK:

npx expo install expo-application expo-clipboard expo-constants expo-localization @react-native-async-storage/async-storage

Bare React Native projects​

If you are not using Expo CLI, install peer dependencies with your package manager and pin versions compatible with your React Native/Expo Modules setup.

npm install expo-application expo-clipboard expo-constants expo-localization @react-native-async-storage/async-storage

@react-native-async-storage/async-storage is optional if you provide a custom storage adapter in config. See Custom Storage.

Expo Modules setup (React Native CLI)​

The peer dependencies above (expo-application, expo-clipboard, expo-constants, expo-localization) are Expo Modules — they ship native code that has to be autolinked into your android/ and ios/ projects. In an Expo project this happens automatically; in a bare React Native CLI project you add Expo Modules once:

npx install-expo-modules@latest

This sets up Expo Modules autolinking (and on iOS raises the deployment target to the Expo Modules minimum).

install-expo-modules also switches the native JS bundling step to Expo CLI (export:embed), which requires metro.config.js to extend expo/metro-config (a superset of @react-native/metro-config, safe in bare projects). The tool usually migrates this for you — verify it, especially if you had a customized metro.config.js:

metro.config.js
const { getDefaultConfig } = require("expo/metro-config");
const { mergeConfig } = require("@react-native/metro-config");

module.exports = mergeConfig(getDefaultConfig(__dirname), {});

Then align the Expo package versions to your setup:

npx expo install --fix
Hitting build or runtime errors?

If the app throws at startup or a release build fails after adding Expo Modules, see bare React Native CLI build issues.

Device info provider​

The SDK reads the device model, manufacturer, and OS version for probabilistic fingerprinting (deferred-link matching). Install one of the supported providers — both are optional peer dependencies and the SDK auto-detects whichever is present:

npx expo install expo-device

Choose react-native-device-info if your project already depends on it; otherwise expo-device is the simplest option for Expo apps. If neither is installed, fingerprinting falls back to "unknown" device values, which reduces deferred-match accuracy.

Credentials in app config​

import { type Config } from '@swmansion/react-native-detour';

export const detourConfig: Config = {
  apiKey: process.env.EXPO_PUBLIC_DETOUR_API_KEY!,
  appID: process.env.EXPO_PUBLIC_DETOUR_APP_ID!,
  shouldUseClipboard: true,
};

Keep apiKey and appID in environment variables or another secure configuration layer.

Next steps​

  1. Implement the provider and link handling in SDK Usage.
  2. Pick a runnable app pattern in Examples.
  3. If upgrading existing code, follow Migration to v2 and start from From 0.x or From 1.0.1.

We are Software Mansion.

Hire us