Localizations

React PDF Viewer provides different localization files that can be used to localize the user interface.

Installing

npm install @react-pdf-viewer/locales

Using a localization file

The locales package provides the following localization files whose each of them is a JSON file:
LocaleFileFrom
Arabiclib/ar_AE.json1.0.0
Chinese (simplified)lib/zh_CN.json1.0.0
Chinese (traditional)lib/zh_TW.json1.0.0
Englishlib/en_US/json1.0.0
Frenchlib/fr_FR.json1.0.0
Germanlib/de_DE.json1.0.0
Italianlib/it_IT.json1.0.0
Japaneselib/jp_JP.json1.0.0
Koreanlib/ko_KR.json1.0.0
Portugueselib/pt_PT.json1.0.0
Russianlib/ru_RU.json1.0.0
Spanishlib/es_ES.json1.0.0
Vietnameselib/vi_VN.json1.0.0
In order to use the given localization file, you need to import it and pass it to the localization option of the Viewer component.
The example below applies the German localization file:
import { LocalizationMap, Viewer } from '@react-pdf-viewer/core';
// Import the localization file
import de_DE from '@react-pdf-viewer/locales/lib/de_DE.json';
const defaultLayoutPluginInstance = defaultLayoutPlugin();
// render function
<Viewer localization={de_DE as unknown as LocalizationMap} />;
You can use the Locale Switcher plugin to add a menu that allows users to switch between different locales.

Using a RTL language

If you want to use a RTL language such as Arabic, it's recommended to use the direction option. So the user interface is shown in the same direction. See this example for more details.