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
- yarn
- pnpm
npm install @tolgee/format-icu
yarn add @tolgee/format-icu
pnpm 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.