如何为npm包打补丁
我们在开发中经常遇到,npm包有点小问题或者不符合我们的场景。
通常的解决方案,是提交一个issue或者PR,等待作者修改,又或者copy源码到本地,修改依赖指向本地。
这两种方案,都有明显的缺点,不是等待时间太久,就是太过暴力。
这里推荐一个新的方案:patch-package
patch-package适用于对npm包简单的修改,它能在不copy源码修改依赖的前提下,将修改记录下来,利用git进行管理,保证修改在组内小伙伴间一致。
通过npm scripts集成,可以无感的使用,效果不错,成本较低。
话不多说,上demo:
0、准备
首先,当然是安装patch-package,按照文档说明来,装devDependencies就好了
yarn add patch-package --dev
1、栗子生成
这里拿lodash.clonedeep 这个包来做一下实验
找到cloneDeep函数,增加一行console.log
2、补丁生成
然后执行命令生成补丁,格式是这样滴 npx patch-package 【包名】,还有其他复杂参数,参考文档自行选用
npx patch-package lodash.clonedeep
如图所示,生成成功了,提示我们说,Created file patches... blabla
查看一下目录下的patches文件夹,如下图所示,生成了lodash.clonedeep+4.5.0.patch文件
文件描述了我们修改了什么,第几行,和git的记录类似。
3、补丁还原
补丁生成好了,接下来就是还原,我们首先将lodash.clonedeep包内的修改还原。
然后,使用 命令还原我们的修改。
npx patch-package
执行完后,再查看文件内容,会发现我们的修改已经回来了。
将代码跑起来,会发现我们的修改确实应用了。
4、传播与集成
至此,我们的补丁就打好了,不过好像还少了点什么。
对,缺了自动化。
我们通过npm scripts 进行自动化还原,每次构建之前,进行打补丁工作,这样我们的修改就能同步给组内其他小伙伴了。
"scripts": { "serve": "npm-run-all postinstall vue-cli-service serve", "build": "npm-run-all postinstall vue-cli-service build" "postinstall": "patch-package" },
以上呢,是简略后的scripts,大致思路就是利用npm-run-all 执行postinstall,安装我们的补丁,然后再进行构建。
使用方法不变,只是增加了打补丁的过程。
5、注意事项
(1)patch是锁定版本号的,如果升级了版本,patch内容将会失效,最好在package.json能够锁定版本号。
(2)魔改一时爽,但是也失去了升级的能力,提issue和PR才是正途。
(3)patch能够支持多少文件修改,没有具体测试,预感是只能支持少量修改。
标签:npm,package,补丁,修改,如何,打补丁,patch From: https://www.cnblogs.com/sexintercourse/p/17021764.html