Zum Inhalt springen
Expo i18n

Expo i18n — Localize your React Native app

Add internationalization to your Expo app with offline support, automatic device locale detection, and OTA translation updates.

Get started in 4 steps

1

Install packages

Add the Better i18n Expo adapter along with expo-localization and react-i18next.

terminal
npm install @better-i18n/expo expo-localization react-i18next i18next
2

Initialize in i18n.ts

Call initBetterI18n() at module scope. It registers the CDN loader and configures i18next with your project's languages.

i18n.ts
import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';
import { initBetterI18n } from '@better-i18n/expo';

i18n.use(initReactI18next);

export const { languages } = await initBetterI18n({
  project: 'your-org/your-project',
  i18n,
  defaultLocale: 'en',
  debug: __DEV__,
});
3

Import in App Entry

Import i18n.ts at the top of your app entry point so it initializes before any screens render. No provider wrapper needed.

App.tsx
// App.tsx or _layout.tsx (Expo Router)
import './i18n';

export default function App() {
  return <NavigationContainer>...</NavigationContainer>;
}
4

Translate in Components

Use the standard react-i18next useTranslation hook in any screen or component.

screens/HomeScreen.tsx
import { useTranslation } from 'react-i18next';
import { Text } from 'react-native';

function HomeScreen() {
  const { t } = useTranslation();
  return <Text>{t('welcome')}</Text>;
}

Why use Better i18n with Expo?

Zero native modules — works in Expo Go without ejecting
Offline-first — MMKV or AsyncStorage persistent cache
Device locale — auto-detects language via expo-localization
Instant switching — locale changes without UI flash
OTA updates — push translation changes without an app store release
react-i18next compatible — works with existing i18next setups

Ship your multilingual Expo app today

Manage translations in the dashboard, push updates over-the-air, and keep your app fully localized.