💡Tips: 此操作解决当你本地修改依赖包的源码后,只在本地生效, 而其他人无法同步的问题!!
patch-package 介绍
patch-package npm地址
patch-package github文档
使用流程:
- 安装
npm i patch-package -s
- 修改项目根目录下的 package.json 文件
// 在scripts下添加 "postinstall": "patch-package"
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"postinstall": "patch-package" // 新增!
},
- 手动修改 node_modules 依赖包中的源码
- 手动执行命令创建 npx patch-package xxx 补丁文件 (若有多层modules嵌套请看下面注意事项①)
执行`npx patch-package xxx`(xxx是你要更改的插件依赖包名称)
// 后若没有检测到文件改动,请检查文件路径是否正确(注意事项①)
// 若有改动则会自动在根目录下创建一个patches文件夹,里面会添加一个xxx+version.patch文件
// 在xxx+version.patch可以看到改动的代码
-
测试补丁是否生效
a. 删除node_modules文件,重新执行npm install,检查源码若已经替换则补丁生效
b. 或对更改的依赖包单个卸载重装,重装后需手动执行 npm run postinstall (注意事项②)
注意事项:
- 支持修改依赖包中依赖包内容,例如:
node_modules/package/node_modules/iveiew,通过“/”分割
// 正确示例
npx patch-package package/iveiew
- 对单个依赖卸载重装时要注意重装后的版本号和之前是否一致,若不一致需要重新修改源码提交,执行上面的流程
工作流程:
此插件工作流程就是先检测到你的源码改动,将改动过得源码保存至patches文件夹内,提交到git后,其他人拉项目重新install,会自动执行package.json中的postinstall钩子,将patches文件夹内改动的内容对源码进行覆盖替换