利用pnpm patch命令实现依赖包热更新：精准打补丁指南

需求场景

在Element Plus的el-table组件二次开发中，需新增列显示/隐藏控件功能。直接修改node_modules源码存在两大痛点：

团队协作时修改无法同步
依赖更新导致自定义代码丢失

解决方案选型

通过patch-package工具实现：

📦 非侵入式修改第三方依赖
⚡ 自动生成补丁文件（.patch）
🔄 依赖重装时自动应用修改

大致的流程也比较简单：通过命令拷贝一份依赖库的文件项目，然后用户对该拷贝的项目进行修改，然后通过提供的命令对修改后的代码以及原来的代码进行diff，生成一个xxx.patch的文件，对应项目的package.json会有个pnpm.patchedDependencies字段来指向patch文件，之前其他人安装依赖后，会自动使用到该patch
PS！！！: 确保你的pnpm>=v7.11.0

demo版本

一、新建demo文件夹

bash 复制代码

mkdir patch-demo

cd patch-demo

pnpm init

完成后得到这样结果

二、安装依赖

bash 复制代码

pnpm i normal-tags

完成后得到这样结果

三、接下来，我们对该库进行自己的一些修改

首先，执行如下指令：生成一个normal-tags的临时文件夹：

bash 复制代码

# 注意这里要指定对应的版本
pnpm patch normal-tags@0.0.3

You can now edit the following folder: E:\demo\patch-demo\node_modules\.pnpm_patches\normal-tags@0.0.3

然后我们打开生成的这个链接
E:\demo\patch-demo\node_modules\.pnpm_patches\normal-tags@0.0.3，在里面修改normal-tags的代码

normal-tags的代码很简单，假设我们要在改方法加上一行打印

修改完成保存后，执行如下指令：

bash 复制代码

pnpm patch-commit E:\demo\patch-demo\node_modules\.pnpm_patches\normal-tags@0.0.3

然后可以看到项目中生成了一个patches/normal-tags@0.0.3.patch的文件，同时在package.json中也增加了如下配置：
然后这就搞定了！查看node_modeles下的is-odd代码，该修改已经加上了，后续别人拿到该项目，重新pnpm i也能得到修改后的代码

源码链接

点击-----github源码仓库 or gitee源码仓库

注意

如果使用window并且使用git-bash的话，文件路径要使用两个\\分割, 如：

bash 复制代码

pnpm patch-commit  E:\demo\patch-demo\node_modules\.pnpm_patches\normal-tags@0.0.3

tips：

欢迎大家进群交流cursor踩坑日记