如何使用npm直接调用第三方库的源码而非压缩/打包后的代码？

临时修改（快速验证） #

• 找到项目根目录下node_modules中目标依赖的源码位置，比如node_modules/lodash/src或node_modules/react-dom/cjs/react-dom.development.js
• 直接修改对应文件的代码：
  • Node.js项目：重启服务后修改立即生效
  • 前端项目（如Webpack/Vite）：多数打包工具会自动检测文件变化并热重载，若未触发则手动重启打包服务或刷新页面
• ⚠️ 注意：这种修改是临时的，执行npm install、npm update或重新安装依赖时，所有修改会被覆盖

持久化修改（避免被覆盖） #

方法1：使用patch-package打补丁 #

• 安装依赖：npm install patch-package --save-dev
• 修改完node_modules里的代码后，执行命令生成补丁文件：npx patch-package [依赖包名]
• 项目根目录会生成patches/[包名]+版本号.patch文件，提交这个文件到版本控制系统
• 在package.json的scripts中添加："postinstall": "patch-package"，这样每次执行npm install后会自动应用补丁

方法2：本地链接依赖源码 #

• 克隆目标依赖的仓库到本地：git clone https://github.com/[作者]/[仓库名].git
• 进入本地克隆的仓库目录，执行npm link（或yarn link）将包链接到全局
• 回到你的项目目录，执行npm link [依赖包名]，此时项目会优先使用本地链接的源码
• 若依赖是TypeScript编写的，在本地仓库执行npm run watch（或对应编译命令），修改源码后会自动编译，项目中立即生效
• 这种方式适合长期调试或深度修改源码的场景

TypeScript项目额外提示 #

• 若修改的是TS源码，需确保本地依赖已编译为JS（可通过tsc --watch自动编译）
• 修改类型定义文件（.d.ts）后，重启VS Code的TypeScript语言服务（快捷键Ctrl+Shift+P，选择"TypeScript: Restart TS Server"）即可生效

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