文章目录
- 一、应用场景
- 二、patch-package 和 postinstall
- patch-package
- postinstall
- 三、操作步骤
- 1、使用yarn安装patch-package和postinstall-postinstall
- 2、修改package.json
- 3、修改node-model中源码、保存。
- 4、找到修改文件对应的包名
- 5、使用git将新增的patches文件同步到仓库
- 6、新环境拉下仓库,验证修改是否成功。
- 四、通过git维护自定义依赖库
- 修改方式
一、应用场景
最近在进行开源平台的二开工作,有一些功能不可避免的需要改动一些依赖包的源码,会修改node_models
中的代码。
在开发环境中,我们可以直接通过yarn gulp -> yarn start
进行编译测试,但是如果我想将代码同步到仓库时候则遇到了问题:一般不会将node_models文件进行同步,则别人拉下来的代码依然是未修改的版本。
那么如何解决这个问题呢?
二、patch-package 和 postinstall
patch-package
patch-package
是一个用于修改第三方依赖包的工具,主要用途包括:
- 临时修复依赖包中的bug:当第三方库有bug但未及时修复时,可以直接修改源码
- 定制化需求:对依赖包进行个性化修改以满足特定需求
- 紧急修复:在等待官方修复期间,使用本地补丁解决问题
使用流程:
- 安装
patch-package
到开发依赖 - 直接修改
node_modules
中的依赖包代码 - 生成补丁文件
- 提交补丁文件到版本控制系统
postinstall
postinstall
是 npm/yarn 的生命周期钩子脚本之一:
- 自动执行:在执行
npm install
或yarn install
后自动运行 - 定义位置:在
package.json
的scripts
字段中定义 - 常见用途:
- 应用补丁(如使用 patch-package)
- 构建原生模块
- 初始化项目配置
- 执行必要的设置脚本
三、操作步骤
1、使用yarn安装patch-package和postinstall-postinstall
命令行:
yarn add patch-package postinstall-postinstall
报错解决:
对于工程需要明确:将依赖项添加到根还是添加到特定的工作区包:
若:将依赖项添加到根 workspace,执行:
yarn add <package-name> -W
# 或者
yarn add <package-name> --ignore-workspace-root-check
若:将依赖项添加到特定的工作区包,执行:
yarn workspace <workspace-name> add <package-name>
所以以上代码替换为:
yarn add patch-package postinstall-postinstall -W
2、修改package.json
// package.json
"scripts": {"postinstall": "patch-package",
}
postinstall
是 npm 或 yarn 安装依赖后自动执行的脚本,通常用于执行后续配置或修补操作。这里将其指向patch-package
3、修改node-model中源码、保存。
4、找到修改文件对应的包名
执行以下代码:
yarn patch-package 你的包名# 以protomaps为例
yarn patch-package protomaps
然后会在根目录下出现:
5、使用git将新增的patches文件同步到仓库
(新安装包后,yarn.lock也会修改,因此同步提交)
6、新环境拉下仓库,验证修改是否成功。
执行yarn install的时候会自动执行patch-package,自动替换源码补丁。修改成功
四、通过git维护自定义依赖库
若需要二开大量修改源码的时候,还可以单独维护一个自定义依赖库。这样拉取代码的时候可以自动获取你修改后的依赖版本。
修改方式
在package.json中,找到devDependencies
下对应的包名,将原先的版本号,替换为git+仓库路径:
例如,以terriajs包为例:
"devDependencies": {
"terriajs": "git+http://github.com/yourGitRepository/terriajs.git",
}
然后再次在终端输入以下命令,安装依赖并启动项目,偶尔会碰到github被墙的问题(也可以使用gitea/gitlab)
yarn install
yarn gulp
yarn start
这样拉下来的就是更新后的版本了。