You need to try this NPM Package

#npm #javascript #node

The title might sound clickbait but I really find this NPM Package to be extremely useful. The Package I'm talking about is patch-package.

Last week I've made an app, Postzy, and I needed a clean way to slightly modify one NPM Package I was using. This is when I come across patch-package. I was so happy because it was doing exactly what I needed it to do (and this rearely happens with a package 😃).

How does it work?

It's very simple to use.

Patch a package

You first need to go and make some changes to a package inside your node_modules folder.

After that, you can run npx patch-package [package-name] or yarn, if you're using yarn.

It will create a folder called "patches" inside the root folder of your project. You'll need to commit this folder to git to share the patch with your team and also deploy the changes to your server (depending on your deploy flow).

Apply a patch

After you made a patch, to apply it you can define a npm run command like "postinstall": "patch-package". You can run this command on the server after npm install or on your local machine to apply the patch.

If you have any question, don't hesitate to contact me.

Top comments (9)

Ben Sinclair • Jan 25 '21

"You need to try this NPM Package"

The title might sound clickbait

Perhaps it would be better if it was descriptive - something like, "Here's a great tool to help you patch your NPM packages" ?

Răzvan Stătescu • Jan 26 '21

I said might because I really think this package is awesome :) For me, it was very helpful and I really think this is a package you need to know about.

Tobias Nickel • Jan 25 '21

Nice, OnceI was working on a project and did something similar. I beeded to patch two packages. 'pomelo' and 'bearcat-dat', booth are absolute crap. and I am happy not to use them anymore.

I also made a directly with patch files and a script to copy them into place. patch-package looks much more clean.

In a current project we are updating sub dependencies with Yarn resolve (resolve property in package.json).

Răzvan Stătescu • Jan 26 '21

Yes, with patch-package is pretty clean and easy to patch a package.

algorythm • Jan 27 '21

Hi:
Thanks for this article.
I am trying to patch a file in the react-dnd-html5-backend package. It has a dist and a lib folder under node_modules/react-dnd-html5-backend. I am not quite sure which files to change in the node_modules folder since the package has cjs, umd and esm folders for each module system. I tried updating the file under the lib folder and following the rest of the steps, but I couldnt see the change being reflected.
Any suggestions/guidance would be greatly appreciated.
Thanks in advance :)