patch-package in React Native

patch-package is used to solve the issues in node module dependency. It helps authors to make and keep fixes to npm dependencies.

While developing an application if we need to modify or customize any react native libraries we can modify those in node modules. But if we want to share those with our team members we have to zip the library file and share. Else while we are running npm install or yarn install all the libraries are updating, hence our changes may also be lost.

`patch-package` allows you to modify the code in the node_modules` directory, in the form of patches. The usage was quite simple too.

npm i patch-package

Open node module, we need to patch. Make the changes in that library. Test it. Or you can change the code using the terminal itself.

vim node_modules/some-package/brokenFile.js

Here some-package should be the library name and brokenFile.js is the file we are updating

Creating a .patch file

npm

npx patch-package package-name

yarn

yarn patch-package package-name

Here package-name is the name of the library we are editing.

This will create a new patch and place it in the correct place. We can see a new folder called patches inside the root dir of your app and all patches will be inside that.

For committing the patch file and to share this fix with the team

git add patches/some-package+3.14.15.patch
git commit -m "fix brokenFile.js in some-package"

To execute that patch whenever we do npm or yarn install

yarn add patch-package postinstall-postinstall

We have to add the postinstall script inside our package.json file. That will enable the postinstall to actually apply or patch every time we do a yarn or npm install.

"scripts": {
+  "postinstall": "patch-package"

}

Running patch-package with or without options

If we are running patch-package without any arguments, it will apply all patches in your project. We can give options also. The options for this are the following.

1)--use-yarn

By default, patch-package checks whether you use npm or yarn based on which lockfile you have. If you have both, it uses npm by default. Set this option to override that default and always use yarn.

2)--exclude <regexp>

Ignore paths matching the regexp when creating patch files. Paths are relative to the root dir of the package to be patched.

Default value: package\\.json$

3)--include <regexp>

Only consider paths matching the regexp when creating patch files. Paths are relative to the root dir of the package to be patched.

Default value: .*

4)--case-sensitive-path-filtering

Make regexps used in — include or — exclude filters case-sensitive.

5)--patch-dir

Specify the name for the directory in which to put the patch files.

Nested packages

If you are trying to patch a library inside another library we can do this as follows.

npx patch-package package/another-package

It works with scoped packages too

npx patch-package @my/package/@my/other-package

References

patch-package

Thank You