How to do multiple imports of a third party component

[Gu, Samuel]

Hi @kirillzyusko , thank for the helpful library. But got a question as a first time user.
I need to import a third party component in different files by different components, but not sure which is best way to do so.

For example:
option 1)
File A:

const ThirdPartyComponent = register({ require: () => require('rn-third-party-library') });
<ParentComponentA >
{ThirdPartyComponent()}
</>

File B:

const ThirdPartyComponent = register({ require: () => require('rn-third-party-library') });
<ParentComponentB >
{ThirdPartyComponent()}
</>

option 2)
index.ts:
export const ThirdPartyComponent = register({ require: () => require('rn-third-party-library') });
File A:

<ParentComponentA >
{ThirdPartyComponent()}
</>

File B:

<ParentComponentB >
{ThirdPartyComponent()}
</>

Could you advise which option should be taken or any better solution?

[Kirill Zyusko]

Hi @SamuelGuNUAA

For me second option looks more preferable, since you will have less code duplication :) I would recommend you to go with this option.

Though it's important to remember, that if you are trying to make some libraries lazy-loadable (such as react-native-reanimated, react-native-gesture-handler) - it may break your app (especially in release mode) 🙂