Use Webpack to Conditionally Include an Intl Polyfill for Older Browsers

InstructorDamon Bauer

Share this video with your friends

Send Tweet

Some browsers, such as Safari < 10 & IE < 11, do not support the JavaScript Internationalization API, which react-intl depends on. In order to support these browsers, we’ll conditionally include an Intl polyfill using webpack require.ensure. This ensures only browsers that need the polyfill incur the extra load.

Andrew McElroy
~ 7 years ago

Hi, thanks for the course! Quick question: should runApp() not be inside the require.ensure's callback method, because it is async?

Ashley Connor
~ 7 years ago

Great course overall. Only thing missing IMO is a video on flipping between languages. Default browser lang isn't always the preference.

Neal van der Valk
~ 7 years ago

Is it anyhow possible to split all the logic for the IntlProvider to a seperate file in stead of to the main app.js? I've been doing this but the only roadblock I have is how to do the runApp() function if the logic is in another folder.

Szymon
~ 7 years ago

Great course! It would nice to add a few more lessons about switching languages, loading translations and locale data files conditionally based on user's locale (so if a page supports 10 languages, users don't need to download everything for all of them) and loading translations only required for a given page when using code splitting in webpack.

Akmal
~ 7 years ago

How could we handle server side rendering (when window is undefined)?