how to load multiple JSON files instead of single JSON file of a single language about react-intl-universal HOT 2 CLOSED

Fixed in v1.9.2.

https://github.com/alibaba/react-intl-universal/releases/tag/1.9.2

from react-intl-universal.

Hi @cwtuan, thanks for the fix. Having language local data in multiple files is a great, and a must-have feature for any non-trivial application.

The issue I'm having is with the standard Object.assign function which is used in the load function implementation: it overrides existing defined locales.

Example:

ComponentOne has locales defined in the same folder, in the file localesOne.json:

{
  "en-US": {
    "hello": "hello from component one" 
  }
}

ComponentTwo has locales defined in the same folder, in the file localesTwo.json:

{
  "en-US": {
    "hello": "hello from component two" 
  }
}

load function is used in each of the respective components:

// componentOne
intl.load({
  'en-US': require('localesOne.json');
});
// componentTwo
intl.load({
  'en-US': require('localesTwo.json');
});

The issue occurs when the load function is invoked for the second time, it overrides the entire en-US locale which was already loaded. This means that once the locales for componentTwo are loaded, locales for componentOne are non existent any more (and vice versa).

The solution for this could be using deep merge, thus preserving the old values within the object being extended.

This way the load method could be leveraged in each of the smart components, and managing .json files throughout the application woud be nice and easy.

Is this something that could potentially be implemented?

from react-intl-universal.