'React-intl with a custom react components library

I'm having a hard time to create a react library that supports translations. Let's say I have this structure

components
|- Button1
    |- Button1.tsx
    |- index.ts
|- Button2
    |- Button2.tsx
    |- index.ts
lang
|- en.json

what I want is, when my library is imported it already has translations. The problem is I need to add IntlProvider into each component. What's more I cannot use useIntl hook in the same component where I use IntlProvider. The only possible way is to add HOC to each component. Is there's a more slick way of doing that?

reactjs react-intl

Solution 1:^[1]

I got an answer on github. Basically the whole flow should be changed by using appropriate CLI commands from format.js (extract and compile).

Solution 2:^[2]

Maybe to call intl imperatively will help you too accomplish the needed result.

https://formatjs.io/docs/react-intl/api#createintl

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Petr Schukin
Solution 2	artiom-damaschin

'React-intl with a custom react components library

Solution 1:[1]

Solution 2:[2]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]