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
4
votes
0 answers

React Redux Router Intl keep locale synced between intl state and router state

I have an app using React, Redux, React-Router and Intl (also react-intl, react-intl-redux, react-router-redux, react-redux). The basic setup, nothing fancy, I guess. …
Tiberiu Maxim
  • 1,474
  • 14
  • 24
4
votes
1 answer

Localizing a currency range

A combination of formatjs & javascript's native Intl.NumberFormat() supports formatting of numbers as currency in various cultures and units. But how can I format a range of currency as $1,000.00 - 5000.00. Without repeating the symbol, where ever…
Jason Kleban
  • 20,024
  • 18
  • 75
  • 125
4
votes
2 answers

Prevent Re-Render when React Element passed as Prop

In my React app, I am using a few libraries (i.e. Material UI and React Intl) to pass React elements as props from higher-level components down to "dumb components" that have one job: to render. Smart component: import ActionExplore from…
Jon Cursi
  • 3,301
  • 4
  • 27
  • 53
4
votes
1 answer

How to define localization with defineMessages method?

I want to localize my component. I use yahoo/react-intl lib. I define some messages const messages = defineMessages({ greeting: { id: 'app.home.greeting', description: 'Message to greet the user.', defaultMessage:…
BILL
  • 4,711
  • 10
  • 57
  • 96
4
votes
2 answers

Internationalization with React.js using Yahoo's react-intl

I'm trying to support different languages in a React.js app and found react-intl to be a good candidate. They've been transitioning into V2 but I'm having a hard time figuring out how it all works together. The example app is too complex and…
Reed G. Law
  • 3,897
  • 1
  • 41
  • 78
3
votes
1 answer

Formatjs / react-intl with Vite

Formatjs provides a babel plugin for modules that use react-intl to inject message IDs and remove description. How can I use it with Vite?
Dheeraj Vepakomma
  • 26,870
  • 17
  • 81
  • 104
3
votes
2 answers

Images do not display on sliders (swiper) when switch direction based on react-intl

I am using react-intl to change the local language and as one of the languages needs to be 'rtl', I used a solution mentioned in a question. dir={intl.locale === 'en-US' ? 'ltr' : 'rtl'} However, when the direction is switched to 'rtl', images do…
Amirhosseinkcle
  • 51
  • 3
3
votes
1 answer

CRA + react-intl crashing when id is unknown

I am using create-react-app and react-intl and I am having the issue that I am fetching data from an API and I want this data to be translated into several languages component from react.intl Because I…
Sebastian G
  • 31
  • 3
3
votes
1 answer

react-intl with server side rendering

Problem Next js SSR environment is failing to detect the locale for some languages like "gr" and "rs" or "es". I'm using react-intl https://github.com/formatjs/formatjs This is causing my browser to show this error on page load. utils.js:19 Error:…
user391986
  • 29,536
  • 39
  • 126
  • 205
3
votes
0 answers

Combining mutiple languages and source files in a monorepo using react-intl

For our project I'm building a number of React apps in a monorepo. We have a package that centralizes our i18n logic. It holds a number of date functions and it contains json files with general translations for English, German and French. One of our…
BraMKJ
  • 183
  • 1
  • 11
3
votes
2 answers

No messages returned when running formatjs extract on project. Any ideas of why?

So, I'm implementing a project in Electron and wanted to implement internationalization into it. I have a simple component that uses react-intl's FormattedMessage and a messages.js file with a description of its message. I tried to follow the…
Tonon
  • 67
  • 2
  • 4
3
votes
0 answers

Runtime requirements for react-intl with NextJs - how to polyfill?

I'm trying out a new way to integrate react-intl with NextJS. I've had a lot of problems with the example from the official repo. Basic translations work. But whenever I navigate to a page with a german translation I see this error: Error:…
Xen_mar
  • 8,330
  • 11
  • 51
  • 74
3
votes
0 answers

React-intl - How to use a default Locale

This could be a very easy question, however I've not been able to find the answer for it anywhere. How do I use a default locale with react-intl? Specifying a default message every time gets really messy. The way that I'm doing it at the moment…
Tyler
  • 1,163
  • 16
  • 37
3
votes
1 answer

How to format specific words in a sentence in react-intl

How to render nested elements in react-intl What I'm trying to render: This is a House This has been discussed here and there should be examples in the docs, but I can't find them.
Xen_mar
  • 8,330
  • 11
  • 51
  • 74
3
votes
2 answers

Intl Polyfill + Next.js SSR application

How can I polyfill intl on a Next.js application? Some Chinese browsers still don't have it, and we use react-intl, which requires Intl.
Matthew I
  • 1,043
  • 2
  • 10
  • 16
1 2 3
…
26 27