修改node_module中的包，却不受重新安装的影响

Posted 2023-03-14

参考技术A

修改别人的源码往往有这几个方式：

显而易见，上面这两种方法既不优雅，也不可靠。作为程序员的我们岂能被这事儿给难住，开源社区早已给我们准备好了解决方案：patch-package ^[1]

通过cra开启一个项目

给项目@alifd/next（ui库）、patch-package、postinstall-postinstall（使用yarn安装时需要安装，npm无需安装此依赖）

给 package.json文件中添加脚本命令（ 非常重要，无论我们使用yarn还是npm，在整体安装结束后都会自动执行该命令，对node_modules中的包打补丁 ）

我们引入组件button，并查看组件当前结构

我们去node_module中修改button源码

我们在看看页面情况（如果没有效果的话，可以重启一下服务 ）

<figcaption mp-original-font-size="14" mp-original-line- style="margin: 5px 0px 0px; padding: 0px; outline: 0px; max-width: 100%; box-sizing: border-box !important; word-wrap: break-word !important; text-align: center; color: rgb(221, 165, 45); font-size: 14px; line-height: 22.399999618530273px;">result.png</figcaption>

修改完并且也生效了，我们就要开始打补丁了，运行命令 yarn patch-package package-name

成功后你会看到根目录多了一个patches文件夹，里面包含了你修改的npm包的patch文件。点开可以很清楚的看到你都做了哪些修改。 文件名中的1.22.21就是依赖包的版本号，表示这个补丁只对1.22.21版本的插件生效

删除node_module并重新安装

依赖包安装完成后可以在命令行中看到补丁被应用（倒数后5行）

yarn start 重新启动，查看审查元素，依旧是a标签！