This patch release improves support for using Browserify or Webpack to bundle react-intl
. Since the context of these tools is to bundle for the browser, this release will only include the English locale data in the bundle by default. (Previously the data for all locales would be included when bundling with Browserify or Webpack.)
When you need to support another locale in your app and you're using Browserify or Webpack, we recommend the following approach:
// app.js
var ReactIntlMixin = window.ReactIntlMixin = require('react-intl');
// ...
<script src="/app.bundle.js"></script>
<script src="/react-intl/dist/locale-data/fr.js"></script>
This will expose ReactIntlMixin
as a global object in the browser, allowing you to load the script for the locale data you need for the page or current request.
Creating Small Bundles with Browserify
Since react-intl
has a dependency on react
, you'll need to configure Browserify to use the uglifyify
transform so that it can reduce the react
package down to only what's needed for production. Here's what you can do to get a react-intl
+ react
bundle down to 42KB gz:
$ NODE_ENV=production browserify -g uglifyify app.js -o app.bundle.js
$ uglifyjs bundle.js -c -m -o app.bundle.min.js
$ gzip -k app.bundle.min.js
Source Maps Improvements
This release also includes improvements to source maps, making debugging easier.