Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Use Lerna with React Native?

Is it possible to use Lerna (lernajs.io) with React Native? I'm attempting to create new project with the following structure:

MyApp
  packages
    myapp-core
    myapp-mobile
    myapp-web

lerna bootstrap doesn't seem to have any issues with core or web, but mobile (which is a React Native project) refuses to find the myapp-core module.

I recall there is some issue with npm link in React Native. Is that what is causing the problem? Is this functionality something that will eventually exist?

like image 499
samcorcos Avatar asked Jan 06 '17 20:01

samcorcos


People also ask

Does Lerna work with React-Native?

It looks like as of react-native: 0.40.0, lerna works as expected. I created a minimal demo app that uses a sharedpackage to change the background color of both a React and a React Native app for those who are interested:

Is Lerna bootstrap having issues with React Native and core?

lerna bootstrapdoesn't seem to have any issues with coreor web, but mobile(which is a React Native project) refuses to find the myapp-coremodule. I recall there is some issue with npm linkin React Native. Is that what is causing the problem? Is this functionality something that will eventually exist? npmreact-nativelerna Share Improve this question

How do I add packages to my Lerna repository?

We’re ready to start putting packages into our Lerna repo. Start by creating a packages directory which is the default Lerna directory. This can be changed in the lerna.json configuration if you want a different name for your packages. To save time, clone down our example repository.

How do I create an independent version of Lerna?

Create a new lerna repo or upgrade an existing repo to the current version of Lerna. --independent / -i – Use independent versioning mode. Bootstrap the packages in the current Lerna repo.


2 Answers

As mentioned in comments React Native packager is not working with symlinks. Which makes it impossible to use Lerna which creates symlinks to local subpackages from the same monorepo.

Fortunately, there is an alternative packager which supports symlinks. Works well for me so far https://github.com/callstack-io/haul/

like image 165
Ihor Burlachenko Avatar answered Oct 13 '22 12:10

Ihor Burlachenko


It looks like as of react-native: 0.40.0, lerna works as expected. I created a minimal demo app that uses a shared package to change the background color of both a React and a React Native app for those who are interested:

https://github.com/samcorcos/learna-react-native

Steps to reproduce:

  1. clone the repo and cd in
  2. npm install
  3. ./node_modules/.bin/lerna bootstrap

Then you can run each app (npm start for react, react-native run-ios for react native) and you'll see the background changed to red based on the input from the shared repo. When you add new packages, make sure you add the new package to each of the relevant package.json files, just as I've added shared to both the web and mobile projects.

Note that this project does not take advantage of Lerna's --independent versioning system.

like image 8
samcorcos Avatar answered Oct 13 '22 13:10

samcorcos