[vscode]快速更新package.json里的依赖版本

最新推荐文章于 2025-03-27 09:38:17 发布

weixin_33854644

最新推荐文章于 2025-03-27 09:38:17 发布

阅读量4.9k

点赞数

文章标签： json 开发工具 java

原文链接：https://segmentfault.com/a/1190000009704851

版权

本文介绍了如何使用VSCode快速更新`package.json`中的依赖版本，以及插件npm-dependency的安装和使用方法。同时提醒读者注意依赖版本更新的限制，如semver规则，以及当使用私有包源时的配置设置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

vscode是个超级好用的开发工具，谁用谁知道。

不少前端开发者可能有和我一样的依赖保绿强迫症，简单说，就是见不得下面这些图标：

图片描述

但是手动一个个依赖检查么？不现实，也太累了。

用npm update？那说明你还是太年轻了，看看它的说明吧：

This command will update all the packages listed to the latest version (specified by the tag config), respecting semver.

注意粗体部分，也就是说，npm update注定了不能帮你把依赖更新到“真正的”最新版，因为semver是有要求的。

譬如，你有一个依赖dep1，它的版本信息如下：

{
   "dist-tags": { "latest": "1.2.2" },
   "versions": [
     "1.2.2",
     "1.2.1",
     "1.2.0",
     "1.1.2",
     "1.1.1",
     "1.0.0",
     "0.4.1",
     "0.4.0",
     "0.2.0"
   ]
 }

然后，假设你的package.json里是这样写的：

"dependencies": {
   "dep1": "^1.1.1"
 }

那么npm update之后，它会变成"dep1": "^1.2.2"，这很好，对不对？

但如果你的package.json里是这样写的：

"dependencies": {
   "dep1": "~1.1.1"
 }

那么npm update之后，它会变成"dep1": "^1.1.2"，惊喜不惊喜？意外不意外？

如果不理解~和^的区别，那你需要去看dependencies-semver。

因为这个缘故，我想了想，可以写个插件解决问题。

安装

打开vscode
按下⌘ + P(windows下是ctrl + P)，打开Command Palette
键入ext install vscode-npm-dependency找到npm-dependency插件
点击安装

使用

安装完毕后，选择一个你要更新的项目，并打开package.json文件，然后在打开的文档里，右键选择Npm update (latest)，效果如下：

图片描述

你的package.json就这样被更新了。

注意事项

有朋友的依赖直接用了Git URL，那么这些依赖是会被忽略的，因为npm registry是拿不到这个包版本信息的。

有朋友用了自己部署的npm registry，例如，通过cnpm自己搭建了内部服务器，并且向其提交过私有包，那么显然从官方的https://registry.npmjs.org是不可能同步到你的私有包的，这就需要配置了，给你的vscode增加如下配置(可以是工作空间级别的，当然也可以是用户级别的)：

{
    "npm.registry": "https://registry.npmjs.org/"
}

npm.registry的值，可以替换为：https://registry.npm.taobao.org等其他registry，然后就可以开心的更新了