如何在VS Code中卸载Angular 4应用的无用npm包？

这种明明已经从package.json里移除、却还在npm install或构建时自动回来的依赖，确实挺让人头疼的。我帮你梳理几个排查和解决的步骤，应该能搞定这个问题：

1. 先搞清楚是谁在“偷偷”依赖它们 #

这两个包大概率是你项目中某个其他依赖的子依赖（可能是直接依赖或peer依赖）。先执行这个命令查看依赖树，找出根源：

npm ls @progress @telerik

命令会输出所有引用这两个包的上层依赖，比如如果是ngx-some-package依赖了@telerik/kendo-ui，那你就知道问题出在哪了——要么升级这个上层包到移除了该依赖的版本，要么考虑替换掉这个包。

2. 清理npm缓存和本地依赖文件 #

缓存和lock文件经常会导致这类“幽灵依赖”问题，按下面的步骤操作：

• 先强制清理npm缓存：

  npm cache clean --force
  

• 删除本地的node_modules文件夹和package-lock.json文件：
  • Windows系统：

    rmdir /s /q node_modules && del package-lock.json
    

  • Mac/Linux系统：

    rm -rf node_modules && rm package-lock.json
    

3. 检查项目中的其他配置文件和代码 #

有时候这些包可能被配置在package.json之外的地方，导致构建工具自动去安装它们：

• 检查angular.json（Angular 4可能是.angular-cli.json）：看看scripts、styles或者assets节点里有没有引用@progress/@telerik相关的资源
• 检查tsconfig.json/tsconfig.app.json：确认types或paths里没有配置这两个包的路径
• 全局搜索项目代码：用VS Code的全局搜索功能搜@progress和@telerik，确保没有代码还在import这些包——如果有残留引用，webpack在构建时会自动安装依赖

4. 重新安装依赖 #

做完上面的步骤后，重新执行：

npm install

这时候应该不会再自动安装那两个废弃的包了。如果还是出现，回到第一步的依赖树结果，仔细排查深层的依赖关系。

额外小技巧：标记为可选peer依赖 #

如果排查后发现是某个依赖的peer依赖导致的，你可以在package.json里添加peerDependenciesMeta，标记这些包为可选，这样npm就不会强制安装它们了：

"peerDependenciesMeta": {
  "@progress/your-package-name": {
    "optional": true
  },
  "@telerik/your-package-name": {
    "optional": true
  }
}

记得把your-package-name替换成具体的包名哦。

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