Share react native components across repos


I have three react native projects each with their own repo.

They use very similar components, is there a way I can share these components across repo’s, so I don’t have to update each repo independently?

Or can I create three different apps, from one repo? with only very slight changes to images and configs for each app.


Solution 1: Separated npm package

In my project, I separated my core parts with each npm package.

  1. Create npm package and put your shared components into that.
  2. You can test immediately your shared component’s function with npm link or specify your local package’s absolute path with npm install.
  3. If you want to manage your package more intuitive way, then you can publish your package to npm repository with private mode.

Solution 2: Depend on the environment variable

You can separate your running environment with react-native-config. With this package, created multiple environments .env or .env.production you can separate your runtime variables with ENVFILE=.env npm start or ENVFILE=.env.production npm start. Then in your javascript code, you can refer your each runtime settings.

import Config from 'react-native-config';

const isProduction = Config.environment === 'production';

<Image source={isProduction ? require(..production_image) : require(..development_image)} />

How to show your slight difference in your app depends on you. like Platform.os === 'ios'

Answered By – MJ Studio

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published