如何修改node_modules里的代码

为什么要改node_modules?

在平常的开发中,其实是很少需要改 node_modules 里的代码的。但是如果npm包有点小问题或者不符合我们的场景。

应该怎么改才能是最好的呢?

方法一:直接改
这种很好懂,就是直接进 node_modules 中,找到那个包的代码,并修改对应的地方的代码,然后重启项目,就能达到我想要的效果。

弊端:

  1. 只能是你自己本地用你修改的代码,你同事用不了
  2. 下次npm i之后那个包的代码又恢复原状

方法二:patch-package

patch-package 可以立即修改并保留对 npm 依赖项的修改

1、安装patch-package

npm i patch-package --save-dev

2、修改node_modules
修改完依赖后,运行 patch-package 会自动创建 patch 文件

// 例: npx patch-package element-ui
npx patch-package 依赖名称

根目录下会多一个patches补丁目录
在这里插入图片描述

注意:记得要把patches这个目录提交到git

3、测试补丁是否有效
删除 node_modules 目录,然后重新运行npm install,安装完成后,查看你修改的node_modules里面的代码是否还在。如果在,就说明补丁生效了。

4、修改脚本 package.json
其实这个时候你本地已经使用到了你修改后的代码了,但问题是怎么让你的同事也同步到你的修改后的代码

在 package.json 的 script 中增加

"postinstall": "patch-package"

作用:当同事执行 npm i 的时候,会自动执行 npm run postinstall 这个命令,也就是执行 patch-package ,这时候就会去读取 patches 目录,并将那些补丁打到对应的 node_modules 包里,从而达到同步修改代码的效果

5、注意事项
patch是锁定版本号的,如果升级了版本,patch内容将会失效,最好在package.json能够锁定版本号。
patch能支持多少文件修改,没有仔细测过,或许只能支持少量修改
6、问题: 没有效果,console 打印不出来
多半是没有找对文件,例如 我们修改的是 lodash里面的某个API,一般我们先找个 lodash里的 package.json 文件,然后看 main(入口文件) 的指向,如果没有 package.json 文件,那应该就是默认的 index

相关推荐

  1. git如何修改提交代码名字和邮箱?

    2024-07-10 21:48:03       58 阅读
  2. git如何修改提交代码名字和邮箱?

    2024-07-10 21:48:03       57 阅读
  3. 如何使用chatgpt修改代码

    2024-07-10 21:48:03       24 阅读
  4. Python如何查询es数据

    2024-07-10 21:48:03       28 阅读
  5. 代码修养

    2024-07-10 21:48:03       39 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-10 21:48:03       52 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-10 21:48:03       54 阅读
  3. 在Django里面运行非项目文件

    2024-07-10 21:48:03       45 阅读
  4. Python语言-面向对象

    2024-07-10 21:48:03       55 阅读

热门阅读

  1. 泛型

    泛型

    2024-07-10 21:48:03      20 阅读
  2. 二分查找(红绿标记法)

    2024-07-10 21:48:03       20 阅读
  3. uniapp开发踩过的坑合集( 持续更新 )

    2024-07-10 21:48:03       16 阅读
  4. 算法之工程化内容(1)—— Linux常用命令

    2024-07-10 21:48:03       20 阅读
  5. postman接口测试工具

    2024-07-10 21:48:03       22 阅读
  6. python使用tkinter添加下载进度UI

    2024-07-10 21:48:03       23 阅读