如何优雅的修改node_modules中的依赖库代码

2020-09-262880

背景

无论是 nodejs 开发还是普通的 js 开发,都少不了使用 npm,好用高效的同时,也存在一个问题——如果使用的第三方依赖库不能满足业务需求,或者存在一些还没被修复的 bug,这时难免需要修改 node_modules 目录下依赖库的代码。

但接踵而来的问题时,修改了 node_modules 目录下依赖库的代码,没法分享给团队中的其他小伙伴(正常情况下我们的 git 都会忽略这个目录,不会跟踪这个目录下的代码变动),而且一旦重新 npm install 又要重新修改,非常麻烦。

目前比较流量的有两中方案:

  1. 使用 webpack alias 实现替换文件
  2. 使用 patch-package

个人感觉用 patch-package 会更优雅一点,今天核心也是介绍这种方法

patch-package

使用步骤如下:

  1. npm i patch-package --save-dev,将这个库安装到本地
  2. 项目的根目录 package.json 下,添加 npm postinstall,以便每次执行 npm install 时能合进所有的 patch 文件
    • "scripts": { "postinstall": "patch-package" }
  3. 开开心心修改node_modules 目录下依赖库的代码
    • 比如,我修改了 taro-uiAtIndexes 组件的一个小细节如下:
  4. 执行 npx patch-package <package-name>
    • 如上,修改了 taro-uiAtIndexes 组件后,执行 npx patch-package taro-ui
    • 执行完后,会在本地生成一个 patches 目录,里面有对应的文件,长这样:
  5. patches 这个目录以及里面的文件可以使用 git 跟踪,分享给团队的其他人
    • 当其他人使用 npm install 安装第三方依赖库时,patch-package 会根据 patches目录下的文件,将你改好的代码同步跟新到 node_modules 目录下修改过的依赖库的代码

就是这样简单高效~

分享
点赞4
打赏
上一篇:代理工具Fiddler -调试与替换接口状态
下一篇:解决购物车变化勾选状态时卡顿