如何将npm安装依赖的源码纳入项目仓库，实现离线构建？

好问题！我完全懂你想要摆脱外部依赖、提升构建可靠性的诉求——毕竟npm registry抽风、网络波动或者依赖包下架这种事，真的能把人折腾疯，就像当年用Bundler缓存gems那样，把依赖源码攥在自己手里才踏实。下面给你几个可行的方案，涵盖npm原生操作和你提到的Yarn工具：

一、npm原生手动/半自动化方案 #

npm本身没有像Bundler那样一键缓存所有依赖源码到项目的命令，但可以通过以下步骤实现：

• 下载依赖源码包：对每个需要缓存的依赖，执行 npm pack <package-name>，这会生成一个和npm仓库上完全一致的.tgz压缩包（包含该依赖的所有源码、配置文件和构建脚本）。比如执行 npm pack lodash 会得到 lodash-4.17.21.tgz。
• 统一存放缓存包：在项目根目录新建一个专门的目录，比如 ./npm-deps-cache，把所有下载好的.tgz包放进去。
• 修改package.json依赖路径：把原来的版本号依赖改成本地包路径，比如把 "lodash": "^4.17.21" 替换成 "lodash": "./npm-deps-cache/lodash-4.17.21.tgz"。
• 自动化脚本优化：如果依赖太多手动操作麻烦，可以写个Node脚本遍历package.json的dependencies和devDependencies，自动执行npm pack并把包移动到缓存目录，再批量修改依赖路径。

这样配置后，执行npm install时就会直接从本地的.tgz包安装，完全不需要访问外部registry，而且生成的node_modules和从registry安装的完全一致，也避免了跨版本/平台的兼容性问题（因为你只是缓存了源码包，安装过程还是会在当前环境下执行构建）。

二、Yarn的离线缓存方案 #

Yarn在这方面确实做了更友好的支持，完全可以实现类似Bundler的缓存效果：

• 指定项目内缓存目录：在项目根目录创建.yarnrc文件，添加配置 cache-folder "./yarn-deps-cache"，这样Yarn会把所有下载的依赖源码包缓存到项目内的yarn-deps-cache目录，而不是默认的系统级缓存目录。
• 安装并缓存依赖：执行yarn install，Yarn会把所有依赖的源码包下载到指定的本地缓存目录。
• 把缓存目录纳入仓库：把yarn-deps-cache目录添加到版本控制（记得不要把node_modules加进去）。
• 离线构建：之后只要执行yarn install --offline，Yarn就会完全从本地缓存目录读取依赖包，无需访问外部网络。

这个方案比npm原生操作更自动化，Yarn会自动维护缓存目录里的包，当你更新依赖版本时，它也会自动下载新的源码包到缓存目录，非常省心。

注意事项 #

• 不管用哪种方案，都要记得定期更新缓存的依赖包，避免依赖版本过于陈旧带来安全问题。
• 缓存的.tgz包体积可能不小，提交到仓库前可以确认一下是否有必要缓存所有依赖（比如一些体积特别大的可选依赖可以考虑按需处理）。

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