Creating a guide on local development of React Native package.

[PrimeTimeTran]

Could we consider creating a guide on how to setup React Native locally?

Specifically how to package it for use in a local project. Or how to package it so that when we run npx react-native init AwesomeProject our locally changed repo is used instead of the published one?

I think this would help people who want to contribute to get their foot in the door(myself for sure).

The current contributing guide has a lot of good information but is missing this IMHO.

Looking forward to hearing your thoughts.

[joshuayoes]

There is a great tool called react-native-builder-bob that may be helpful here. https://github.com/callstack/react-native-builder-bob

They have a similar init command like npx create-react-native-library@latest awesome-library, and it has many of the tedious things already done for making a react native library

[PrimeTimeTran]

Perhaps I'm posting in the wrong place.

I'm familiar with this tool as it's the suggested way for creating native modules, or was. I don't see it in the documentation for native modules anymore.

That being said I meant for actually "developing react native", for people who are interested in contributing to the RN project itself.

For example, if I wanted the following line of code to work, how might I go about doing that? But more importantly, test it on my local before I open up a PR to the official repo.

import { Foo } from 'react-native'

Hope that makes sense.

[joshuayoes]

Ah that makes sense!

I'm not sure there is an official guide, that would be helpful.

@cipolleschi did a talk at Chain React for contributing to Codegen, but the principles he talks about should apply to all of the react-native packages. https://youtu.be/3sgOgB9pl1U?t=970

As for running it locally, the react-native monorepo uses yarn 1, so you should be able to use yarn link to test against your package locally: https://classic.yarnpkg.com/lang/en/docs/cli/link/

[PrimeTimeTran]

Thanks for sharing that link, appreciate it. I've searched for guides on how to "get started" contributing but haven't found one I felt was satisfactory.

There are a few pieces of the puzzle missing for me. For example, I know how to create a package and publish it to npm. I did so with this repo as an example(with instructions in the README). So my expectation is that the release process is similar within RN(it's installed from the NPM registry after all).

That being said, what's missing for me is the entry point main key inside of package.json. I don't see it inside the repo's package.json.

I checked the documentation for both npm and yarn and expect they both use the same main key, as documented here, but I could be wrong.

Anyway yeah, a "getting started contributing" document/resource somewhere would be helpful for folks wanting to contribute IMHO. I've run into this issue with RN so would like to be able to help instead of just pointing out problems, just need a bit of help getting started on that.

Appreciate your time so far and looking forward to being able to add to the project more meaningfully one day.

[cipolleschi]

Thanks @joshuayoes for jumping on this question (and for the advertising! xD).

I added another answer below, which could be more fitting for your usecase, @PrimeTimeTran,

[cipolleschi]

Hi @PrimeTimeTran, thanks for the question.

I think that for your use case, the best approach would be to use RNTester. RNTester is an example app that uses React Native from source (i.e: if you modify some source files and rebuild, you'll see your changes) that is contained as a private package of the framework (it is not shipped in a release).

The practical steps are:
0. Have your environment properly set up

1. fork and clone the repo.
2. run yarn
3. follow the RNTester readme to get started.