DEV Community

Ajmal Hasan
Ajmal Hasan

Posted on • Edited on

Make changes to node_modules files with patch-package

#productivity #javascript #reactnative

Library Link

a) Installation

  • Using Yarn: 
yarn add patch-package postinstall-postinstall --dev
Enter fullscreen mode Exit fullscreen mode

or

  • Using npm: 
npm install patch-package --save-dev
Enter fullscreen mode Exit fullscreen mode

b) Update package.json

Add the following script to your package.json file:

"scripts": {
  ...
  "postinstall": "patch-package"
}
Enter fullscreen mode Exit fullscreen mode

This ensures that patches are automatically applied after every install.

c) Usage

  1. Make changes to the files of the specific package inside your node_modules folder.
  2. Run the following command to create a patch:

Using Yarn:

   yarn patch-package package-name
Enter fullscreen mode Exit fullscreen mode

Using npm:

   npx patch-package package-name
Enter fullscreen mode Exit fullscreen mode

(Replace package-name with the actual package name, e.g., react-native, react-native-push-notification, etc.)

  • Patching Nested Packages:

If you're patching a nested package, such as node_modules/package/node_modules/another-package, use a / between package names:

   npx patch-package package/another-package
Enter fullscreen mode Exit fullscreen mode

This also works with scoped packages:

   npx patch-package @my/package/@my/other-package
Enter fullscreen mode Exit fullscreen mode

d) Final Steps

A patches folder will be created in your project directory, containing all the patches you've made.

Commit this folder to your repository. Whenever someone runs yarn install or npm install, the patches will be automatically applied to the respective packages.

Top comments (0)