October 29, 2020 | less than a minute read

The power of patch-package

#devops#webdev

Have you ever been in a situation where a package has a bug that's blocking you?

Have you ever gone to the package's GitHub page, searched for an issue that matches your problem, and commented "I need this fix"?

Stop that.

What you need is patch-package.

I can't tell you enough how useful this is. Instead of having to wait for fixes to be released, I use this tool as a hotfix, and when a new version is ready that includes the fix, I simply delete the patch file it generates.

Here's an example that came up recently:

I upgraded our app to CRA 4.0 at work, but noticed that the build and rebuild times became much slower.

Looked around to find this comment inside a GitHub issue that matched my problem.

Went to

1node_modules/react-scripts/config/webpack.config.js
like the comment said and plopped this in:

1new ESLintPlugin({
2 // Plugin options
3 cache: true, // this
4 extensions: ['js', 'mjs', 'jsx', 'ts', 'tsx'],
5 formatter: require.resolve('react-dev-utils/eslintFormatter'),
6 ...

All that was left was to run

1yarn patch-package react-scripts
.

Aww man, it's that easy?

Yeah, it is.