如何修改node_modules目录代码以在Vite中调试排查问题？

临时调试可用的方案 #

方案1：跳过目标依赖的预构建 #

Vite默认会预构建node_modules中的依赖，修改源文件后预构建缓存未更新，导致浏览器仍加载旧代码。可在vite.config.js中配置跳过该依赖的预构建：

export default {
  optimizeDeps: {
    exclude: ['需要调试的依赖包名']
  }
}

修改配置后重启Vite服务，后续修改该依赖的node_modules文件，刷新浏览器即可生效。

方案2：清除预构建缓存 #

Vite的预构建缓存存放在node_modules/.vite目录，直接删除该文件夹后重启Vite服务，修改后的依赖代码会被重新加载。

方案3：用patch-package做临时补丁（可选） #

如果需要临时保留修改内容，可借助patch-package生成补丁：

• 安装依赖：npm install patch-package --save-dev
• 修改node_modules里的目标文件
• 执行命令：npx patch-package 依赖包名，项目根目录会生成patches文件夹保存补丁
• 重启Vite服务，补丁自动生效
  调试完成后删除补丁文件即可。

注意事项 #

• 以上方法仅用于临时调试，切勿将修改后的node_modules文件提交至版本控制
• 调试结束后，记得恢复相关配置（如移除optimizeDeps.exclude中的依赖），避免影响项目性能

内容的提问来源于stack exchange，提问作者Robin Schambach