DEV Community

Pradnyanand Milind Pohare
Pradnyanand Milind Pohare

Posted on • Edited on

How to fork GitHub repository and use as npm dependency inside a react-native project

Forking is the one thing I have never used in git. Yesterday I came to know how can we use it.

Why we use a fork?

Open source is a great thing, someone writes a library, so that others can use it, others can add up to it. Let's assume you are using an open-source library in your project, the library has everything you need except that the one thing you need for your project. That's where forking comes to help. Basically forking means you are creating a copy of the open-source library, making appropriate changes, committing back or submitting a pull request to the author of the open-source library.

How to fork an open-source library

  1. Click on the Fork button on the right top corner of open-source GitHub repository

  2. Then clone the forked library inside your local directory

  3. git clone "forked lib URL"

  4. Make appropriate changes to the library and commit it

  5. git add .

  6. git commit -m “commit message”

  7. git push origin master

Now all the changes you want to make in the open-source library are there, the only thing remaining is to use this forked library as a dependency in your react native project.

How to use GitHub repository as an npm dependency in a react-native?

We make changes in open source libraries because we want the library to behave different for our project. Now consider a scenario

  1. You went to node_modules/open_source_library

  2. You made the changes

  3. You are done here but in the future, there will be a case where we need to delete node_modules in order to resolve Android Studio’s linking with react-native libraries.

  4. Now you will run npm install in order to install the open-source library. All your changes now has override by the original library. This means you need to make those changes again.

That’s why we fork the library and make changes so that we can use it as an npm dependency. Only question here is "How can we so that?”

It's very simple, You just need to run following command.

  1. You should be in your project directory
  2. npm install --save git+https://git@your fork repository URL without https://.git

You will notice that inside package.json in the dependency section, Instead of the open-source library version you will see your fork library.

That’s it. I hope this blog will help you in any way possible.

If you want to read more Do visit my website. Cheers.

Top comments (9)

Collapse
 
rasfuranku profile image
Rasfuranku

You could also use it from your local directory and install it as npm install --save path/to/dependency

Collapse
 
paddy57 profile image
Pradnyanand Milind Pohare

true. I shared the way so people working with you on project can also make change in fork lib.

Collapse
 
paddy57 profile image
Pradnyanand Milind Pohare

👍🏻

Collapse
 
paddy57 profile image
Pradnyanand Milind Pohare

If you find any error or anything which is not correct please write here, I'm happy to talk about it.

Collapse
 
dina profile image
codeforme

bro can u help me with yarn example.....it asking version

Collapse
 
paddy57 profile image
Pradnyanand Milind Pohare

it asking version ? Didn't get you.

Collapse
 
chithras111 profile image
Chithra S

Could you please give an example of step 2. npm install --save git+git@your fork repository URL without https://.git

Collapse
 
renetik profile image
Rene (Renetik) Dohan

Looks like everyone can just misguide its so easy while the truth is that most libraries will not work this way .. Am I wrong ?

Collapse
 
paddy57 profile image
Pradnyanand Milind Pohare

Seems like it. I have used many open source project as npm package by forking it for my projects.