FormatJS / react-intl là monorepo i18n chuẩn cho React. Format messages, dates, numbers, currencies theo locale.
Install
npm install react-intl
Basic setup
import { IntlProvider, FormattedMessage } from 'react-intl'
const messages = {
'app.greeting': 'Hello, {name}!',
}
<IntlProvider locale="en" messages={messages}>
<FormattedMessage id="app.greeting" values={{ name: 'Tâm' }} />
</IntlProvider>
Format patterns
// Number / currency
<FormattedNumber value={1000} style="currency" currency="VND" />
// → ₫1.000
// Date
<FormattedDate value={new Date()} year="numeric" month="long" day="2-digit" />
// Relative time
<FormattedRelativeTime value={-1} unit="day" />
// → yesterday
Extract & compile messages
# Extract from source
npx formatjs extract 'src/**/*.tsx' --out-file messages/en.json
# Compile for production
npx formatjs compile messages/vi.json --out-file compiled/vi.json
Source
https://github.com/formatjs/formatjs · ⭐14.7K