Quick Start
@rerune/react@1.9.0
Install command
npm install @rerune/react@1.9.0 i18next react-i18nextKeep native configuration
Keep your existing native options and JSON resources. These imports use example paths; keep your own paths and settings. The object can stay in your current startup or be inlined. No new file or exported options object is required. Both alternatives use these same options, including escapeValue: false.
Keep native configuration
import type { InitOptions } from 'i18next'
import en from './locales/en/translation.json'
import de from './locales/de/translation.json'
const nativeOptions = {
lng: 'en',
fallbackLng: 'en',
ns: ['translation'],
defaultNS: 'translation',
resources: { en: { translation: en }, de: { translation: de } },
interpolation: { escapeValue: false },
} satisfies InitOptionsAlternative setups: replace Before with After. Do not run both.
Replace initialization
Keep imports at module scope. The Before ReRune version awaits i18n.init in your async startup. ReRune.setup returns the client synchronously, so call it once at module scope. nativeOptions is your unchanged configuration above. Await client.ready only where native initialization is asynchronous. Run setup once, never during each render.
After ReRune
import { ReRune } from '@rerune/react'
const client = ReRune.setup({
otaPublishId: '<READ_ONLY_OTA_PUBLISH_ID>',
}, nativeOptions)SDK 1.9.0 creates an isolated i18next instance from your native options and returns the client synchronously; client.ready resolves when native initialization has finished. Setup reads no storage and sends no requests: ReRuneProvider restores the cache and checks for updates after its first commit. First-run offline startup needs locally available resources; previously fetched OTA needs retained cache.
Replace the root provider
In your existing root, use i18n from the native startup after it resolves, or the client that setup returned. App is your existing component. Preserve defaultNS when used. ReRuneProvider includes native context; do not nest both providers. External translation or language-switching code can use client.i18n.
After ReRune
import { ReRuneProvider } from '@rerune/react'
<ReRuneProvider client={client} defaultNS="translation">
<App />
</ReRuneProvider>Existing instances, plugins, and attachment
For backend loaders, detectors, .use(...) plugins, or global-instance wiring, retain your app-owned i18n instance and pass it to ReRune.setup with the same nativeOptions. App-owned options keep their native defaults. For an instance that is already initialized or still initializing, omit the second argument; passing options again throws. With a backend loader or detector, await client.ready where you awaited i18n.init. Hooks outside ReRuneProvider need your existing global wiring. Native HTTP loaders keep their startup and offline requirements. SDK-created instances default escaping to false; explicit options win, and raw HTML still needs appropriate handling.
Setup with your existing instance
import { ReRune } from '@rerune/react'
const client = ReRune.setup({
i18n,
otaPublishId: '<READ_ONLY_OTA_PUBLISH_ID>',
}, nativeOptions)Keep your existing application component and native translation calls. This example reads the headline key from your resources.
Translation code stays the same
import { useTranslation } from 'react-i18next'
export function App() {
const { t } = useTranslation()
return <h1>{t('headline')}</h1>
}Removing ReRune
Restore both Before ReRune blocks with the same options and resources. Remove optional ReRune refresh, status, and variant controls, then uninstall the SDK. Keep i18next, react-i18next, and your plugin chain. Replace client.i18n references with your native instance. Native bundles or loaders must cover the messages you need: OTA and variants stop and ReRune’s cache is no longer consumed. Apply this source change and restart the app; unmounting a provider is not live rollback.
Uninstall the SDK
npm uninstall @rerune/react
