vue修改node_modules中的文件后续安装依旧保存

最新推荐文章于 2025-05-08 15:00:23 发布
最新推荐文章于 2025-05-08 15:00:23 发布
阅读量1.2k 收藏 3
点赞数 3
CC 4.0 BY-SA版权
文章标签： vue.js 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/MadSnail00/article/details/131722312
当node_modules中的依赖有bug或不满足需求时，可以使用patch-package来安全地修改源码并保存更改。步骤包括安装patch-package，修改package.json，手动调整依赖源码，创建补丁文件，然后即使重新安装，修改也不会丢失。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

需求：如果node_modules 中的依赖有bug 或者 不满足我们的地方， 我们需要更改node_modules 依赖包中的源码时，为了不更改后，别人或者自己重新 npm install 时， 导致我们的更改丢失，我们需要用到patch-package

1.通过命令安装 patch-package

npm install patch-package --save-dev

2.修改项目根目录下的 package.json 文件

   在 package.json 文件中的 scripts 中加入 "postinstall": "patch-package"

3.手动修改 node_modules 依赖包中的源码

 例如：修改的是node_modules中easyscroller文件夹中的EasyScroller.js文件源码

4.手动执行命令创建 npx patch-package package-name 补丁文件，package-name就是node_modules中的根文件夹名，依赖包的名字

例如：修改的是easyscroller文件夹中以内的文件

执行命令 npx patch-package easyscroller

5.项目根目录中会自动创建一个 patches 文件夹，每次修改不同的依赖包，每次都要执行npx patch-package package-name

6.这样 哪怕修改依赖的源码之后， 重新 npm install ， 也不会导致我们的修改内容丢失

 

 

MadSnail00
关注
vue项目共享node_modules
m0_72015462的博客
05-24 1307
多项目共享同一个node_modules
vue中node_modules中第三方模块的修改使用详解
10-16
主要介绍了vue中node_modules中第三方模块的修改使用,本文图文并茂给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
Vue修改node_modules中的第三方插件代码（后续npm install依旧保留该修改）
山有木兮木有枝 心悦君兮君不知
01-31 4822
有时在开发过程中，如果node_modules 中我们使用的第三方插件有bug （作者又没有提供相应的API供我们扩展修改，提了issue也没人管）或者本身不满足我们的地方， 我们需要更改node_modules 依赖包中的源码时，为了不更改后，别人或者自己重新install 时， 导致我们的更改丢失，我们需要用到patch-package。（魔改的同时，也局限了升级的能力，尽量还是去提issue）
vue修改了node_modules中的包，打补丁
云_飞扬
05-08 515
像这样 npx patch-package @amap/amap-jsapi-loader。npx patch-package 修改的node_modules中的包的名称。2、在package.json的scripts中增加配置。4、运行npm install检查是否有安装补丁包的输出。安装完成后，会在package.json中显示版本号。执行后，注意看根目录下是否生成了文件夹patches。
修改node_modules中安装的依赖（如第三方ui组件样式）并在下次安装时保留
hanchengmei的博客
12-06 1541
如何用保留在node_modules中的修改得内容
如何将项目里node_modules的更改保存起来
wxp的博客
10-08 789
在前端项目开发中，我们经常会遇到node_modules里的包有问题，当自己手动更改成正确的后，自己没问题了，但是别人重新npm install时还会有同样的问题，那么如何将node_modules的更改保存到项目中呢，这样别人在生成依赖后能有一个正常的环境 通过： patch-packagehttps://www.npmjs.com/package/patch-package这个包可以在npm install后按照项目里保存的更改自动修改node_modules，非常好用 使用步骤： 一.安装
vue 修改nodemodules中的依赖包源代码不生效
qq_51389137的博客
05-26 6048
2.重启不行的话现在普遍vue使用的是vite他会把这些依赖的代码缓存在nodemodules的.vite.js下，所以重启项目也没有更新依赖的执行文件。命令行选项启动开发服务器，或者手动删除。强制 Vite 重新构建依赖，你可以用。
next-compile-node-modules:Next.js插件可使用Babel编译所有node_modules
05-27
下一个编译节点模块 Next.js插件可使用Babel编译... 该插件更改Next.js的webpack配置，以默认情况下编译所有node_modules 。 尽管这会影响性能，但它只会减慢第一次编译的速度，而借助内置的缓存，后续编译的速度会更
npm run dev > vue-admin-template@4.4.0 dev > vue-cli-service serve INFO Starting development server... ERROR Error: Cannot find module 'default-gateway' Require stack: - E:\template\vue-admin-template\node_modules\internal-ip\index.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\node_modules\webpack-dev-server\lib\utils\createDomain.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\node_modules\webpack-dev-server\lib\utils\addEntries.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\node_modules\webpack-dev-server\lib\utils\updateCompiler.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\node_modules\webpack-dev-server\lib\Server.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\lib\commands\serve.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\lib\Service.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\bin\vue-cli-service.js Error: Cannot find module 'default-gateway' Require stack: - E:\template\vue-admin-template\node_modules\internal-ip\index.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\node_modules\webpack-dev-server\lib\utils\createDomain.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\node_modules\webpack-dev-server\lib\utils\addEntries.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\node_modules\webpack-dev-server\lib\utils\updateCompiler.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\node_modules\webpack-dev-server\lib\Server.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\lib\commands\serve.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\lib\Service.js - E:\template\vue-admin-template\node_modules\@vue\cli-service\bin\vue-cli-service.js at Module._resolveFilename (node:internal/modules/cjs/loader:1077:15) at Module._load (node:internal/modules/cjs/loader:922:27) at Module.require (node:internal/modules/cjs/loader
03-28
可以尝试清除现有的 `node_modules` 和 `package-lock.json` 文件，然后重新安装依赖项。 ```bash rm -rf node_modules package-lock.json npm cache clean --force npm install ``` 上述命令会彻底移除旧的依赖配置...
D:\JAVA\code\spring-ai-protal> cnpm install | [21/23] Installing vue-router@^4.2.5 unsetInstallDone: D:\JAVA\code\spring-ai-protal\node_modules\.store\ai-hub@0.0.0\node_modules\ai-hub error: Error: ENOENT: no such file or directory, chmod 'D:\JAVA\code\spring-ai-protal\nod× Install fail! Error: ENOENT: no such file or directory, mkdir 'D:\JAVA\code\spring-ai-protal\node_modules\.store\ai-hub@0.0.0\node_modules\ai-hub\node_modules\.bin' Error: ENOENT: no such file or directory, mkdir 'D:\JAVA\code\spring-ai-protal\node_modules\.store\ai-hub@0.0.0\node_modules\ai-hub\node_modules\.bin' at async Object.mkdir (node:internal/fs/promises:858:10) at async exports.mkdirp (D:\JAVA\utils\node\node_global\node_modules\cnpm\node_modules\npminstall\lib\utils.js:125:3) at async bin (D:\JAVA\utils\node\node_global\node_modules\cnpm\node_modules\npminstall\lib\bin.js:36:3) at async linkModule (D:\JAVA\utils\node\node_global\node_modules\cnpm\node_modules\npminstall\lib\install_package.js:413:5) at async _install (D:\JAVA\utils\node\node_global\node_modules\cnpm\node_modules\npminstall\lib\install_package.js:162:5) at async install (D:\JAVA\utils\node\node_global\node_modules\cnpm\node_modules\npminstall\lib\install_package.js:23:12) at async mapper (D:\JAVA\utils\node\node_global\node_modules\cnpm\node_modules\npminstall\lib\install_package.js:270:9) npminstall version: 7.12.0 npminstall argv: D:\JAVA\utils\node\node.exe D:\JAVA\utils\node\node_global\node_modules\cnpm\node_modules\npminstall\bin\install.js --fix-bug-versions --china --userconfig=C:\Users\86159\.cnpmrc --disturl=https://cdn.npmmirror.com/binaries/node --registry=https://registry.npmmirror.com
最新发布
07-05
- 删除项目中的`node_modules`目录和`package-lock.json`（或`cnpm`的`node_modules`和相应的锁文件）： ```bash rmdir /s /q node_modules del package-lock.json ``` - 重新安装依赖（这里使用cnpm）： ```...
vue3 修改naiveui node_modules相关源码
灰太狼-铜豌豆的博客
04-06 689
vue3 修改 node_modules相关源码
vue修改node_modules组件的默认属性
qq_38292936的博客
08-24 293
main.js import Element from 'element-ui'; Element.Dialog.props.closeOnClickModal = false 曲线救国
解决修改了node_modules中的某个依赖中的文件，npm i的时候没有被保存的问题
王等等csdn的博客
10-25 983
项目中引入了公司内部的封装的依赖，因为一些地方与项目实际需求不符，所以对依赖中的.vue文件做了更改，本地打包都可以，但是如果提交到git，同事npm i的时候，就会被覆盖，如果每次都去找个这个文件，再修改一次就很麻烦。例如，在我的项目中，要修改的模块的文件名为Logo.vue, 我将它复制到src/components/Logo.vue。查了一下说使用patch-package，创建补丁的时候没成功，研究了没整明白就放弃了（有大佬明白的可以告诉小老弟）Logo.vue的引入路径为./Logo.vue。
如何postinstall优雅地更改node_modules里的包
飞翔的熊blabla
05-22 1372
在前端项目开发中，我们经常会遇到node_modules里的包有问题，当自己手动更改成正确的后，自己没问题了，但是别人重新npm install时还会有同样的问题，那么如何将node_modules的更改保存到项目中呢，这样别人在生成依赖后能有一个正常的环境 通过： patch-package​www.npmjs.com/package/patch-package正在上传…重新上传取消 这个包可以在npm install后按照项目里保存的更改自动修改node_modules，非常好用 使用步骤：
vue 修改文件不生效_如何修改 node_modules 里的文件
weixin_45437417的博客
07-30 3173
使用patch-package来修改 安装patch-package：npm i patch-package --save-dev 修改package.json，新增命令postinstall: "scripts": { "postinstall": "patch-package" } 修改node_modules里面的代码 执行命令：npx patch-package 修改的文件名。 第一次使用patch-package会在项目根目录生成patches文件夹，里面有修改过的文件diff记录。 当这
怎么优雅的修改node_modules的第三方包
前端泡面人
10-24 2863
怎么优雅的修改node_modules的第三方包？
科学修改node_modules中文件的三种方法
CHANCE_wqp的博客
03-10 2389
在实际项目开发过程中会用到很多第三方包，其中有一些错误或者需要做兼容处理的地方，这时就需要能够在我们的项目中修改特定文件，并把这些修改固定下来，不被install后还原会去。以下介绍三种方法。该方法需额外安装 patch-package，还需执行命令，生成补丁文件。就能在每次执行install命令时将补丁内容替换到node_modules中对应的源文件中。 2、修改项目根目录下的 package.json 文件 执行如下命令 执行该命令后会在项目根目录中自动创建一个 patches 文件夹，该文件夹中就会出
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值