pnpm 打补丁 ​

打补丁这个操作是前端同学所必须要掌握的一个技能。核心是通过打补丁的方式，修改一个第三方库的代码。

为什么需要打补丁 ​

我们在项目开发中是必不可少的会使用第三方库的，第三方库一般情况下是非常之严谨的，但是我们只要在对应的仓库下，还是可以看到有非常多的 issue 的，其中不乏是有提一些 bug 的 issue。

所以第三方库也是会有 bug 的，或者考虑不周的地方，这是常态，毕竟真正的开发环境一定是比作者在思考和构件库时想到的场景要复杂的。

出现了 bug 怎么办 ​

如果我们使用的一个库，有 bug，或者有需要优化的地方，我们该怎么办？大致无非是以下这几种解决方式：

• 换一个库

  换一个，当然这个不一定能满足，有时候替换的还没有原来的好用

• 提 issue，让作者更改

  这个是非常常规的方式，但是作者可能并不会立刻帮忙解决，而我们开发时工期一般都紧急，所以是没办法等的

• 自己帮作者改，提 Pr

  如上，作者可能没有办法第一时间合并你的 pr

• 打补丁

  这个就是我们今天要讲的核心，使用补丁的方式我们就可以非常完美的解决这个问题，不需要等待作者的审核和回应，我们直接本地的修改，只在我们项目中生效。

使用 pnpm 打补丁 ​

目前很多时候我们会选择主流的包管理工具，如 pnpm，所以这里我讲解一下使用 pnpm 如何打 patch 补丁。

pnpm 打补丁 和传统的 yarn 和 npm 打补丁是不同的，pnpm 包管理工具其默认就支持了打补丁这个功能。 而 yarn 或者 npm 是需要手动去安装patch-package 这个库来实现的。

具体 yarn 或者 npm 如何实现，这里就不做记录了，会更加复杂一点，可以参考这个文档：手把手教你使用 patch-package 给 npm 包打补丁

pnpm 打补丁大家也可以看其官网：pnpm patch pkg，主要有以下几步：

• pnpm patch pkg

  如：pnpm patch @radix-ui/themes，执行之后终端会返回一个地址，我们打开它，就是这个对应包的内容。可以对其做一些修改。

  

• 打开它，修改你想要改动的代码。

  如我们做一些代码修改，将:root 改为 :host

  

• pnpm patch-commit path

  这个 path 就是第一步的 path

  

  修改完之后我们项目将会多一个 patch 文件夹。已经多一个文件。

  

• 检查 node_modules 对应的文件是否已经发生改变

  

到此，补丁完成。后续我们如果删除 node_modules，重新 pnpm install，安装完成后 pnpm 会自动读取 patch 文件夹下的内容，将代码修改为 patch 内容。

总结 ​

这个就是打补丁的思路和实现，用它可以快速解决一些第三方库的问题。方便又好用！