Stack Overflow
Stack Overflow

Questions tagged [react-intl]

React Components for internationalization. Combines react components with FormatJS.

This library provides React Components and a Mixin to format data and strings, and internationalize your React app.

Features

  • Formats numbers and dates/times, including those in complex messages.
  • Formats relative times (e.g., "3 hours ago").
  • Formats complex messages, including plural and select arguments using ICU Message syntax.
  • Supports custom formatters for numbers and dates/times.

Installation

npm install react-intl
396 questions
2
votes
1 answer

react on rails / react intl

I am trying to implement i18n for a rails/react_on_rails project following this guide; https://github.com/shakacode/react_on_rails/blob/master/docs/basics/i18n.md I get the error "formatMessage is not defined", so I am probably missing something,…
hso
  • 345
  • 3
  • 19
2
votes
1 answer

Redux - external libs and "React" in reducer?

I have simple Redux reducer, but for some actions I need to show notifications, in order to do so I need to trigger my custom notification function within the reducer so: case REDUCER_ACTION_NAME: notificationDisplay.success("Message", { …
Wordpressor
  • 7,173
  • 23
  • 69
  • 108
2
votes
1 answer

react Intl - how to get value from formattedMessage

I have a component that takes a number. I'm getting this number from my language pack with a FormattedMessage } /> when I console log num inside…
Turnipdabeets
  • 5,815
  • 8
  • 40
  • 63
2
votes
1 answer

Use statically generates messages in React Intl

I have an object that contains content for a page, I import it and try to use it like you'd use any object variable: import {Variable} from 'data' const message = defineMessages({ message: { id: 'component.title', defaultMessage:…
Obed Parlapiano
  • 3,226
  • 3
  • 21
  • 39
2
votes
1 answer

Is there any way I can get the format of date based on locale?

I'm using Intl library in my javascript code, as below: const dateFormat = new Intl.DateTimeFormat(locale, { day: '2-digit', month: '2-digit', year: 'numeric', }); kk = new Date('1992-10-28') dateFormat.format(kk, 'en-Us') ==>…
Priyanka Sharma
  • 167
  • 3
  • 7
2
votes
1 answer

React-Intl: Locale data added to IntlMessageFormat is missing a `pluralRuleFunction`

I'm recently use React-Intl for internationalisation in my Multiple Page React App. I write a component "IntlProviderWithLocal" to add custom locale. import React from 'react' import {IntlProvider, addLocaleData} from 'react-intl'; import zh_CN…
喝茶的螃蟹
  • 134
  • 6
2
votes
1 answer

react-intl translate relative time (like 3 minutes and 50 seconds)

I use a react-intl for translating an application. I got a time in seconds which repesents how long did it take to complete a task and I want to show this time as a relative time. ("2 minutes" instead of pure 120 seconds) But when I…
Roman Nikrmajer
  • 21
  • 3
2
votes
1 answer

react + typescript, how to distinguish exported and internal props?

consider the following component: interface OProps { // property here should be sent by parent id: string; } interface IProps { // property here just use internal for intellisense notNeed: number; } export class Foo extends…
Duck Hsieh
  • 21
  • 2
2
votes
1 answer

How do I determine the decimal and thousands separator for the current locale in the browser?

We are using react with react-intl and need to write our own custom input fields for reasons. While it is possible to pass in a number to the react-intl API and get the number back properly formatted, how can we find out the current locale…
Kenoyer130
  • 6,874
  • 9
  • 51
  • 73
2
votes
2 answers

How to add locale data dynamically using React Intl?

Am using React-intl for internationalization of an UI Util Library. The library has a folder say i18n wherein I place json files for different locales.If the user of this library want to add support for additional locales, he/she can place…
Santhosh
  • 534
  • 9
  • 24
2
votes
1 answer

Fractional plural forms in react-intl or intl-messageformat (javascript i18n packages)

I am using react-intl package for internationalization. The package, in turn, relies on intl-messageformat. I’ve been searching through the docs in both packages, but am still confused about whether it is possible to internationalize messages for…
azangru
  • 2,644
  • 5
  • 34
  • 55
2
votes
2 answers

Static React App/Webpage Multi-language

I have spend a week to figure out this question currently I'm using gatsby to generate my static web app. i have tried to do it -pages --en ---index.js ---main.md ---contact.md --zh ---index.js ---main.md ---contact.md it's kind a works,…
Necmttn
  • 1,137
  • 1
  • 9
  • 17
2
votes
1 answer

How to generically write a shortcut method for React.js components with decorators?

I am using React Intl for my internalization and have to write this.props.intl.formatMessage({id: 'some.message.id'}, values) to get a translated string in the render() method. Now, how should a decorator look like to provide a shortcut function for…
Maxim Zubarev
  • 2,403
  • 2
  • 29
  • 48
2
votes
1 answer

React Intl: async loading just one specific locale data in a Universal App

I'm making a multi language universal app using React and I'm having a hard time to find out the best way to deal with locale data. The app is going to be available in 16 languages and the amount of translated messages are quite big, so I can't…
Coluccini
  • 688
  • 1
  • 7
  • 18
2
votes
1 answer

React webpack bundle not utf-8

I am building a react webapp using among other things webpack and react-intl. My app is supposed to be in swedish and english. When i build the web app in development mode it works fine. But when I build the app and run it as a static web site I run…
Albin
  • 2,912
  • 1
  • 21
  • 31
1 2 3
…
26 27