Only few locales with Browserify

[imevro]

Hi, thanks for this library!

I don't understand, how use locales with Browserify. For example, I include ReactIntl in app.js as

const ReactIntl = window.ReactIntl = require('react-intl');

and set locales in Handler (I use react-router)

<Handler locales={['ru']} flux={fluxInstance} />

Then I include ru locale as

<script src="/scripts/app.js"></script>
<script src="/react-intl/dist/locale-data/ru.js"></script>

But it doesn't working. Why?

[ericf]

Can you provide some details on what specifically isn't working?

Also you need to make sure you're Handler component uses the ReactIntl.IntlMixin in order to add locales to the component hierarchy's context.

[gitim]

Hi! I have the same problem while using react-into with browserify and trying to add some locales. I investigated the problem and understood that while using react-intl with browserify it doesn't provide ReactIntl object into the global scope unlike using react-into from react-intl/dist, but locale modules from react-intl/dist/locale-data/ need to access to ReactIntl from global scope to add new locale, so they fail. I committed my bundle, as you can see ReactIntl isn't exported into the global scope.

[ericf]

@gitim We have some docs on this tucked away in the release notes:
https://github.com/yahoo/react-intl/releases/tag/v1.0.2

s/ReactIntlMixin/ReactIntl/

[gitim]

Didn't know about this, thank you, will try it.

[gitim]

It worked in 1.0.2 when locale used __addLocaleData of ReactIntlMixin: fr.js 1.0.2, but in 1.2.0 it doesn't work since now locale uses __addLocaleData of ReactIntl: fr.js 1.2.0

[ericf]

I'm confused. I said above to rename what's in the 1.0.2 release post to ReactIntl.

[gitim]

Oh, sorry, did't understand you, thanks @ericf.

[ericf]

I used IRC-replace style shorthand because I was on my phone 😄

[faassen]

A note here for those who also find this issue:

When you test this, don't use normal date formatting, as it will know the names of the months and such in all locales, I think because it's part of the intl system. So it seems as if all locales are bundled, but they are not.

Instead, use something like FormattedRelative, which does use special locale data. Without the additional dist file loaded, things will display in English, but once you load the appropriate locale the current language will be displayed.

I used:

   <FormattedRelative value={new Date() - (1000 * 60 * 60 * 24)} />

which displays "yesterday" in the appropriate language.

[ericf]

See: #162