如何在package.json中引入fork的npm库并在安装时执行其构建？

这问题我之前也碰到过！原包维护者只发布dist目录的产物，而直接引用GitHub仓库的话，npm默认只会拉取源码，不会自动跑构建流程。给你几个可行的解决办法：

方案1：给fork仓库添加prepare脚本（最推荐） #

npm有个内置的prepare脚本，不管你是从npm源安装还是从Git仓库安装依赖，npm都会在安装完成后自动执行这个脚本。刚好可以用它来触发构建：

• 打开你fork的仓库根目录下的package.json
• 在scripts字段里添加一行（保留原有脚本的前提下）：

  "scripts": {
    // 原有的build、test等脚本保留
    "prepare": "npm run build"
  }
  

  注意：如果原仓库的构建命令不是build（比如Angular项目可能是ng build），就改成对应的命令就行

• 把这个修改提交并推送到你的bugfixes分支
• 回到你的应用，重新执行npm install，这时候npm会自动跑prepare脚本帮你构建出dist目录，依赖就能正常用了

方案2：提前构建产物并推到单独分支 #

如果不想修改原仓库的package.json，可以提前把构建好的产物推到一个单独的分支：

• 本地克隆你的fork仓库，切换到bugfixes分支
• 执行原仓库的构建命令（比如npm run build）生成dist目录
• 创建一个新分支：git checkout -b dist-bugfixes
• 把dist目录里的所有文件直接复制到分支根目录（不要带dist文件夹本身，要和原包发布到npm的结构一致）
• 提交这些文件并推送到GitHub：git add . && git commit -m "Add built dist files" && git push origin dist-bugfixes
• 修改你应用的package.json里的依赖：

  "ngx-infinite-scroll": "github:你的GitHub用户名/ngx-infinite-scroll#dist-bugfixes"
  

• 执行npm install，这次拉取的就是已经构建好的产物，直接能用

方案3：本地npm link调试（适合开发阶段） #

如果你还在不断修改bug，需要实时调试的话，用npm link更方便：

• 本地克隆你的fork仓库，切换到bugfixes分支，执行构建命令生成dist目录
• 进入dist目录，执行npm link，把这个构建好的包链接到全局
• 回到你的应用目录，执行npm link ngx-infinite-scroll，这样应用就会使用本地链接的包
• 每次修改fork仓库的代码后，重新构建，应用就能自动拿到最新的修改

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