Skip to main content
Version: 5.x.x

Formatting

Formating is a way how to render translation into a final string, with variable parameters. Formatters are supported in form of plugin.

Simple formatter

FormatSimple plugin if you just need to include variables in your translations. It is very minimalistic, only intended to interpolate your parameters and save your bundle size.

import { FormatSimple } from '@tolgee/web';
...
tolgee.use(FormatSimple());

Example

tolgee.t('basket_items', '{count} items in the basket', { count: 10 })
// -> 10 items in the basket

Icu formatter

For advanced formatting functionality install FormatIcu plugin, which is shipped in separate package.

npm install @tolgee/format-icu

Use it like this:

import { FormatIcu } from '@tolgee/format-icu';

tolgee.use(FormatIcu());

Examples

tolgee.t('progress', 'Progress: {progress, number, percent}', { progress: 0.1 })
// -> Progress: 10%

tolgee.t('basket_items', '{count, plural, one {# item} other {# items}} in the basket', { count: 10 })
// -> 10 items in the basket

Read more about ICU message format

info

For react-native you might need to polyfill Intl object. Use @formatjs/intl-locale and @formatjs/intl-pluralrules to make plurals work.