I am trying to use intl to do some formatting but no matter what I pass in as the locale, I always get the following error message:

ReferenceError: No locale data has been provided for this object yet

I have tried the following:

new Intl.NumberFormat('en-ZA', { minimumFractionDigits: percentDecimals });

as well as

new Intl.NumberFormat(['en-ZA'], { minimumFractionDigits: percentDecimals });

and I am not sure what else do.

I have added the package to the package.json

"intl": "latest"

and I do import it

import Intl from "intl";

I am trying to use intl to do some formatting but no matter what I pass in as the locale, I always get the following error message:

ReferenceError: No locale data has been provided for this object yet

I have tried the following:

new Intl.NumberFormat('en-ZA', { minimumFractionDigits: percentDecimals });

as well as

new Intl.NumberFormat(['en-ZA'], { minimumFractionDigits: percentDecimals });

and I am not sure what else do.

I have added the package to the package.json

"intl": "latest"

and I do import it

import Intl from "intl";

• javascript
• jasmine

2 Answers 2

Depending on the enviromnent you are running this code you might need to import locale data as well to polyfill locale

import 'intl/locale-data/jsonp/en-ZA'

This import does side-effect that register en-ZA locale IntlPolyfill.__addLocaleData({locale:"en-ZA", when polyfill is required.

For me it was solved by importing the "intl" at the top of the source code of the app.

In my case I was doing the import in (i18n.ts). (i18n.ts) is where i18next is initialized. Then I have to move the import to the App.tsx.

// Polyfill Intl as it is not included in RN
import "intl";