DEV Community

Cristian Velasquez Ramos
Cristian Velasquez Ramos

Posted on • Originally published at

The power of patch-package

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 node_modules/react-scripts/config/webpack.config.js like the comment said and plopped this in:

new ESLintPlugin({
    // Plugin options
    cache: true, // this
    extensions: ['js', 'mjs', 'jsx', 'ts', 'tsx'],
    formatter: require.resolve('react-dev-utils/eslintFormatter'),
Enter fullscreen mode Exit fullscreen mode

All that was left was to run yarn patch-package react-scripts.

Aww man, it's that easy?

Yeah, it is.

Top comments (0)