当安装的第三方依赖包存在自身错误或业务不适用时解决方案

wen_文文
140 阅读1分钟

场景：当安装的第三方库存在自身代码错误或和业务场景有细小差别时的解决方案：

  • 方案1：可将这个依赖包下载到项目本地，然后进行定制化修改，即作为本地依赖进行引用；
  • 方案2：直接在node_modules下对应的依赖包中进行修改，使用patch-package打补丁插件同步给其他人；避免重新安装依赖后修改的内容丢失；

案例：react虚拟列表插件react-virtualized，在项目启动时会报一个错误，

原因： WindowScroller.js文件中并没有导出这个模块，而且当前文件中也并没有使用这个导出的模块，所以可以判定当前这行代码为无用的代码，可以直接删除；

image.png

解决方案：

  • 使用 patch-package 修改第三方库的代码，并将修改的内容同步给团队中的其他人，避免团队开发时不同步的问题；

解决步骤：

  • 1）去掉源码node_modules/react-virtualized/dist/es/WindowScroller/utils/onScroll.js:74:9 路径中报错的这行语句； image.png

  • 2）命令行中执行 npx patch-package react-virtualized 命令， 此时项目根目录会多出 patches 目录，用于记录第三方包内容的更改

image.png

  • 3）在package.json文件的script标签中添加 "postinstall": "patch-package"命令，这样每次安装 react-virtualized依赖的时候，都会执行postinstall脚本自动应用patches的修改；（相当于同步给团队中的其他人）
// package.json文件
...
"scripts": {
  ...
  "postinstall": "patch-package"
},
    1. 重启项目即可成功运行；

image.png

avatar
文章
阅读
粉丝