Skip to main content

React Native Installation

Add the Lovina Chat SDK to your React Native project.

1. Request registry access

The SDK is published to Lovina's private Nexus npm registry under the @lovina scope. Ask your Lovina administrator for a Nexus account with read access to the npm-releases repository — there is no self-service signup.

2. Point the @lovina scope at the registry

Create or edit an .npmrc file in your project root:

@lovina:registry=https://packages.ailovina.com/repository/npm-releases/

Only the @lovina scope is redirected; every other dependency still resolves from npmjs.org. This line contains no credentials, so commit it — that way your teammates don't each have to look up the URL.

3. Authenticate

npm login --scope=@lovina --auth-type=legacy \
--registry=https://packages.ailovina.com/repository/npm-releases/

Enter your Nexus username and password when prompted. npm stores the resulting token in your user config (~/.npmrc), never in the project — so your credentials stay out of source control.

--auth-type=legacy is needed because npm 9+ defaults to browser-based OAuth, which Nexus does not implement. npm usually falls back to the prompt on its own, but passing the flag skips a wasted round-trip and avoids a hard failure if a proxy sits in front of the registry.

Alternative: base64 auth (no interactive login)

If you cannot reach the login endpoint, authenticate with basic auth instead. Add to your user ~/.npmrc (not the project file — this line is a credential):

//packages.ailovina.com/repository/npm-releases/:_auth=${NEXUS_AUTH}

NEXUS_AUTH is the base64 encoding of your Nexus username:password:

echo -n 'your-username:your-password' | base64
export NEXUS_AUTH="the-base64-value"

Base64 is encoding, not encryption — anyone who reads the value recovers your password. Prefer npm login where possible.

Continuous integration

npm login is interactive and cannot run in a pipeline. Generate a token once on a workstation, store it as a CI secret, and write it at build time:

- name: Authenticate with Nexus
run: |
echo "@lovina:registry=https://packages.ailovina.com/repository/npm-releases/" >> ~/.npmrc
echo "//packages.ailovina.com/repository/npm-releases/:_authToken=${LOVINA_NPM_TOKEN}" >> ~/.npmrc
env:
LOVINA_NPM_TOKEN: ${{ secrets.LOVINA_NPM_TOKEN }}

Yarn 2+ (Berry)

Yarn Berry ignores .npmrc. Configure the scope in .yarnrc.yml instead:

npmScopes:
lovina:
npmRegistryServer: "https://packages.ailovina.com/repository/npm-releases/"
npmAuthToken: "${LOVINA_NPM_TOKEN}"

npm, pnpm, and Yarn 1 all read .npmrc as described above.

4. Install the package

npm install @lovina/react-native-chat-sdk

Or with yarn:

yarn add @lovina/react-native-chat-sdk

5. Install peer dependencies

The SDK ships no bundled dependencies. It declares these peers:

Peer dependencyRequired versionRequired?
react>=18.0.0Yes
react-native>=0.70.0Yes
react-native-webview>=13.0.0Yes
@react-native-async-storage/async-storage>=1.19.0Optional — enables session persistence

react and react-native are already present in any React Native project. Install the WebView:

npm install react-native-webview

And, if you want conversations to survive an app restart:

npm install @react-native-async-storage/async-storage

iOS Pod Install

react-native-webview and async-storage both contain native code, so after installing them you must link the pods:

cd ios && pod install && cd ..

Skipping this step produces a runtime "native module not found" error rather than a build failure, which makes it easy to miss.

Version Pinning

Install a specific version:

npm install @lovina/react-native-chat-sdk@^{version}

Or pin it explicitly in your package.json:

{
"dependencies": {
"@lovina/react-native-chat-sdk": "{version}"
}
}

Platform Requirements

PlatformMinimum Version
React Native0.70.0+
React18.0.0+
react-native-webview13.0.0+
iOS15.0+
AndroidAPI 24 (Android 7.0)

See Compatibility for the full version matrix.

Verify Installation

Import the widget in any component to confirm the installation:

import { LovinaChatWidget } from '@lovina/react-native-chat-sdk';

Build and run your app. If it compiles without errors, the SDK is installed.

Next Steps

Once installed, head to Usage to embed the chat widget in your app.