[译] 如何更新 package.json 中的依赖项

30天学会Swift-29:SwiftUI-集成第三方库与Swift Package Manager 摘要 本文介绍了在SwiftUI项目中集成第三方库的方法和常用工具。主要内容包括:使用Swift Package Manager(SPM)添加、更新和移除第三方库的详细步骤;推荐了三个实用的SwiftUI相关库(Kingfisher图片加载、Lottie动画、Charts图表)并提供了使用示例;强调了使用第三方库的优势(提高效率、保证质量、实现复杂功能)和注意事项(兼容性检查、文档阅读)。最后设计了两个实践练习:通过Kingfisher显示网络图片和集成Lottie播放动画,帮助开发者掌握实际应用技巧。 阅读详情
AI摘要

本文详细介绍了如何使用npm更新项目依赖的包,包括如何检查过期的包、如何更新package.json中的版本规范,以及如何使用npm-check-updates工具自动化升级过程。

原文:https://medium.com/better-programming/how-to-upgrade-dependencies-in-package-json-e5546804187f

Npm (Node Package Manager) 是一种应用于 JavaScript 编程语言的包管理器,也是 Node.js 的 JavaScript 运行时环境的默认包管理器。

在一个项目中,其包依赖项列表保存在 package.json 文件中。每个已安装的包都被分配了一个版本号,一般由 三部分组成:major.minor.patch 。

  • major 表示非兼容的重大 API 改变

  • minor 表示向后兼容的功能性改变

  • patch 表示向后兼容的 bug 修正

默认情况下,npm 会安装最新的版本,并在版本号前面附加一个 ^ 插入符号,如 “^15.2.0”。有这种插入符号的依赖项意味着至少要安装 15.2.0 的版本。

当存在一个更高的 major 版本时,它就可能被使用。比方说当时有了个 15.6.2,就会在安装时升级到该版本。

若你想更稳妥些,使用 ~ 波浪号 的 “~15.2.0” 以表示只使用 patch 位更高的版本。当然,纯 “15.2.0” 将保证只使用该精确的版本号。语义化版本命名法的更多细节见 https://semver.org/ 。

迄今为止,一切顺利。

问题来了

斗转星移,依赖愈增。当你想升级所有包以获取新特性或是修正缺陷时,你会如何做呢?

首先你得确定最新版本是多少。这里有个 GitHub 上的例子:

{
  "name": "npm_upgrading",
  "version": "1.0.0",
  "description": "A tutorial how to upgrade NPM packages",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/JenniferFuBook/npm_upgrading.git"
  },
  "author": "Jennifer Fu",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/JenniferFuBook/npm_upgrading/issues"
  },
  "homepage": "https://github.com/JenniferFuBook/npm_upgrading#readme",
  "dependencies": {
    "lodash": "~4.17.12",
    "prettier": "1.18.0",
    "react": "^15.2.0"
  }
}

如果你在 VSCode 上安装过 “Version Lens” 的话,它将展示所有包的最新版本:

或者也可以使用 npm 命令行接口:npm outdated

  • Current 即当前被安装的版本

  • Wanted 是满足 package.json 中的 SemVer 范围的最大版本

  • Latest 是该包在仓库中标记为 latest 的版本

  • Location 是该包在所居于的依赖树中所在的位置

CLI 输出中的包颜色表示了过期等级。红色意味着匹配到了一个比 package.json 中定义的 SemVer 需求还要新的已安装版本;黄色表示仓库中有比 SemVer 需求更新的版本。

在上例中,lodash 并未过期,因此没有被列出。同时,Prettier 在 minor 位落后于最新版本了,而 React 是在 major 位。

如果依赖项被修改为这样:

红色标记将会凸显 Lodash 和 Prettier:

解决之道

在找出过期包之后,我们修正 package.json 中相关的版本规格。而后可以运行 npm install 或 npm update 以升级。

  • npm install 会安装一个包及其依赖的任何包。如果该包中存在 package-lock 或 shrinkwrap 文件(在并存时后者优先级更高),将会按其进行依赖项安装。

  • npm update 会更新依赖项列表中出现的所有包,同时也会安装缺失的包。

二者的区别是什么呢?

首先,如果已安装的包版本满足 package.json 中定义的 SemVer 规格,则 npm install 会以模糊版本策略忽略掉它,并不会重新安装;而 npm update 则仍会(译注:在符合 SemVer 规格的前提下)将其升级到对应的最新 latest 版本。

译注:比如成文时 lodash 库的最新版本是 4.17.15,假设已安装版本为 4.17.14,则运行 npm install 后不会有任何变化,而 npm update 会将其升级到 4.17.15。

同时,对 devDependencies 的处理也是不同的:

  • npm install 会安装或升级 devDependencies ,除非添加了 --production 标记

  • npm update 会忽略 devDependencies ,除非添加了 --dev 标记

太概念化了是吧?来举个例子,我们把 Prettier 的版本从 “1.18.0” 改成 “~1.18.0”:

如果运行 npm install,Prettier 的版本就是足够“模糊”的,以致 package-lock.json 中会保留原来的 “1.18.0”:

运行 npm ls 也能看到:

然而运行 npm update 后,package-lock.json 中 Prettier 的版本则会升级到 “1.8.2”:

npm ls 的输出同样也更新了:

此外,Prettier 的波浪号式依赖也被改为插入号式了!

更优方案

如前所述,如果 SemVer 规格使用了波浪号式版本声明,即便是 npm update 也不会直接升级其 major 位版本号。在主版本变动频繁并带来破坏性改变的情形下,这种 update 策略是很有意义的,同时需要谨慎对待。

那么,如果就是想升级 major 版本该如何呢?

使用 VSCode 中的 Version Lens 插件时,我们可以据其提示手动更新依赖包的 major 版本。另外一个强大的工具是 npm-check-updates,会自动化地完成同样的工作;该 npm 工具可以被全局化安装:

npm install -g npm-check-updates

然后运行:ncu -u

现在,package.json 中的依赖项就被升级到最新了,包括 major 位的更新:

剩下的就简单了。运行 npm install 或 npm update 以完成升级。

谨慎使用 npm-check-updates -- 毕竟,能力越大责任越大。



--End--

查看更多前端好文
请搜索 fewelife 关注公众号

转载请注明出处

Halcon 3D视觉实战:5步将线激光高度数据转为可分析的深度图与点云 本文详细介绍了如何利用Halcon平台将线激光高度数据转换为深度图与点云的5步实战方法。通过具体代码示例和工业检测案例(如锂电池胶水测量),帮助工程师高效处理3D视觉数据,实现从原始数据到三维可视化的完整技术链路。 阅读详情

相关推荐

gmsv源代码c语言,石器时代ABLua的原理、简介、过程、运用、收发

操作原理(一)服务端:服务器源文件客户端:客户所操作的程序(既是游戏客户端)接口:既是某项功能(例如:鼠标点击,文字发送,战斗,观战,人物动作等)返回的值ABlua:在源代码中添加的整套引擎作为回调接口--lua所实现的功能是基于服务端源码添加的接口由该接口与客户端发送封包实现功能源码里是否有ABlua回调接口?例如:源码里的gmsv/battle.c文件(既是战斗回调文件)以下为简单描述C给予l...

weixin_35223575的博客 2408

如何优雅的更改package.json版本号

本文的起因是有在代码仓库发包后,同事问我“为什么package.json 里的版本还是原来的,有没有更新?”,这个时候我意识到,我们完全没有必要在每次发布的时候还特意去关注这个仓库的版本号,只要在发布打tag的时候同步一下即可,于是有了本文的实践。node.js 部分,我们得有一个更改仓库代码的脚本留给ci执行我们首先需要在工程目录中的 ./script/..目录下增加一个 update-vers...

zz_jesse的博客 2350

SpringBoot整合oceanbase,实现oracle无缝切换到oceanbase

随着去“IOE”化的潮流,近些年来,许多与国家相关的项目不约而同到地往”国产化“方向靠拢,不可避免地,一些项目可能需要进行数据库迁移。

4622

npm升级package.json中所有依赖包到最新版本

这个需求可能不是很常见,但最近在玩Vite+Vue3时候明显发现相关的一些插件库高速迭代,因为技术较新所以坑多,有时候你好不容易找到解决办法,官方其实已经在修复了,只需要手动更新下对应的包即可,既然是前沿实验性的东西,那自然隔三差五我都想让自己的所有依赖包处于最新状态,能避免一些坑从而不必做一些无用功,如何做?如下。

前源码时代Java讲师,B站万粉博主:程序员瑞哥,联系瑞哥请点击瑞哥头像查看个人简介 3009

OpenWebUI外部模型配置异常排查与修复指南

本文详细解析了OpenWebUI外部模型配置异常的常见问题及解决方案,包括隐藏字符、数据库锁死等典型现象。通过错误日志分析和数据库修复实战指南,帮助开发者快速定位并解决配置问题,确保OpenWebUI与第三方大模型的稳定连接。

weixin_29205061的博客 310

calibre QRC提取寄生参数

typical将上面的文件QCI_flow里面的文件 在Cp 到当前 ,其实应该是某几个文件,但是我给忘记了 就全cp过来了 ,无影响,不过也希望大佬指正。

2202_75711937的博客 1517

npm的package.json和package-lock.json更新策略

如果你之前用npm 安装产生了package-lock.json,后面的人用cnpm来安装你的package.json、package-lock.json安装可能会跟你安装的依赖包不一致,这是因为cnpm 不受package-lock.json影响,只会根据package.json进行下载。 npm、cnpm与package-lock.json的操作 npm install package-lo...

Hello博客 2万+

Autodesk软件网络授权破解

Autodesk 全系列产品网络授权破解 此网络许可授权破解文件及方法适用Autodesk 绝大部分的产品, 安装网络许可证管理器Autodesk网络许可证管理器x64位官方下载地址( https://knowledge.autodesk.com/sites/default/files/file_downloads/nlm11.14.1.3_ipv4_ipv6_win64.msi ) Autod...

weixin_33919950的博客 8254

npm 更新VUE package.json文件中依赖的包版本

1.安装npm install -g npm-check-updates 可能会出现以下错误: npm ERR! syscall mkdir npm ERR! path D:\node\node_global\node_modules\npm-check-updates npm ERR! errno -4048 npm ERR! Error: EPERM: operation not permitted, mkdir 'D:\node\node_global\node_modules\npm-..

5193

PCL 建筑物点云立面和平面分割提取【2025最新版】

在建筑物点云中,立面点和平面点的法向量存在明显的差异,根据法向量在Z方向的分量设置相应得阈值即可实现立面点与平面点的分割。

点云侠的博客 1960

【SWAT】SWAT中预定义河网及流域

平原圩区没有明显的海拔差异。DEM中包含的地形信息无法定义河段的位置和水文连接,SWAT模型Watershed Delineator中提供两种方法,帮助用户输入流域拓扑信息。第一种方法,“Burn-in”和手动绘制河段和子流域边界。首先,使用“Burn-in”功能导入数字河道网络(DCN),并根据DEM和DCN绘制河流和子流域。然后在ArcGIS中编辑“流域”和“河段”层,可以调整位置、范围和水文连接。第二种方法,可以手动绘制或重新编辑河流和子流域,预定义河网及流域。

```On Earth, Be Water, By Coding``` 3273

npm升级package如何对应的更新package.json中的版本号

今天在项目中用npm start 启动一个项目,报如图错误,网上查了之后,是因为package.json文件中,http-server版本太低引起的(我的是0.6.1),解决方法有两种 第一种方法 直接在文件中修改http-server的版本为0.9.0,这样再次启动没有报错。 第二种方法直接用npm update 方法更新,但是更新后发现package.json中对应的版本号并没有改变,...

群来群往的博客 5283

多模型机器学习生存预测分析:AUC比较、生存分层与SHAP解释

本文研究了多种机器学习模型在心力衰竭患者生存预测中的应用。通过比较逻辑回归、随机森林、XGBoost、LightGBM和梯度提升机五种模型的AUC表现,选择最优预测模型。基于最优模型的预测概率对患者进行风险分层,并使用Kaplan-Meier生存分析和log-rank检验验证分层的有效性。最后采用SHAP方法解释模型决策过程,识别关键预测因素。研究提供了从模型构建、评估到解释的完整技术流程,为临床预后预测提供了可复现的分析框架。

AI的内部世界的博客 157

package.json和package-lock.json的区别

最近还整理一份JavaScript与ES的笔记,一共25个重要的知识点,对每个知识点都进行了讲解和分析。能帮你快速掌握JavaScript与ES的相关知识,提升工作效率。

小陈的博客 1198

怀旧版电脑GBC模拟器

再现原版GBC掌机的界面,电脑运行连游戏界面都一样大小,很怀旧,很真实,(英文版)强烈推荐,很小的文件,很难才找到的。

IMSL CNL 7.0.0 (x86-64)Crack

IMSL CNL 7.0.0 (x86-64)Crack intel的算法库破解文件,这是C++版本的破解文件

package.json和package-lock.json的区别及作用

package.json定义项目元信息和依赖的语义版本范围(如^1.2.0),而package-lock.json记录依赖树的确切版本(如1.2.3)及下载地址,确保安装一致性。前者需手动维护,后者由npm install自动生成。两者配合解决依赖不确定性:package.json声明期望版本,package-lock.json锁定实际安装版本,避免"在我电脑正常"的问题。最佳实践:同时提交到版本库,禁用手动修改package-lock.json,团队协作或部署时保证环境完全一致

m0_66119504的博客 1069

霍尼韦尔SoftMaster使用说明

霍尼韦尔SoftMaster使用说明

package.json和package-lock.json区别使用+如何更新一个包

修改某一个包 升级某一个包可以直接修改package.json 然后npm install 就 更新该包了。 #例如 element-ui 为例子 #查看当前版本 npm ls element-ui #可以手动修改package.json 的element-ui #这个时候package.json和package-lock.json不一致,然后再 npm install #这个时候package...

juvenile_的博客 1264

RU DOS版、EFI版32bit/64bit BIOS常用工具

DOS版、EFI版的RU工具,可用来查看IO、MEM、PCI、SMBIOS等资源。亲测在EFI SHELL下可用。

【转载】package-lock.json的作用

【转载】package-lock.json的作用: 原文地址:https://www.cnblogs.com/cangqinglang/p/8336754.html package-lock.json的作用: 其实用一句话来概括很简单,就是锁定安装时的包的版本号,并且需要上传到git,以保证其他人在npm install时大家的依赖能保证一致。   引用知乎@周载南的回答 根据官方文...

聚沙成塔 249

npm 更新package.json

在使用packages.json一段时间之后发现有部分依赖包有了新的版本,如何将package.json中的依赖更新为最新版呢? 安装 npm install -g npm-check-updates 显示当前目录下项目中所有新的依赖包 ncu 更新项目package文件 ncu -u 更多参数 ...

尚 6238

npm-package-lock.json

npm notice created a lockfile as package-lock.json. You should commit this file. https://docs.npmjs.com/files/package-lock.json https://stackoverflow.com/questions/44343997/npm-notice-creat...

weixin_30383279的博客 467

npm如何一键安装package.json里的依赖文件。

原文出处:https://blog.csdn.net/lydia_liuY/article/details/80816267 这里介绍如何使用npm一键安装package.json里的dependencies 和devDependencies里的所有模块。 npm install //默认安装package.json中的所有模块。   如果只想安装dependencies中的内容,可以...

chelen_jak的专栏 3916

vue依赖,package-lock.json,如何更新依赖。

2、第二步:在终端输入npm install --package-lock-only,重新生成package-lock.json文件;1、第一步:备份package-lock.json文件后,删除该文件;

y_king1999的博客 563

将package.json里的所有模块更新

首先安装npm-check-updates插件: cnpm i -g npm-check-updates 然后检查是否有更新: ncu -u 最后确认更新: cnpm install (以上使用的是淘宝的cnpm,国内较npm下载模块速度快)

Predator117的博客 419

Npm简介

Npm:node的模块管理器 1、 npm install (模块名) 安装模块到node_modules目录 $ npm install <packageName> $ npm install <packageName> --force 机制:安装前npm install会先检查node_modules目录里是否已经存在模块,如果有则安装,若希望无论是否...

Yichair的博客 953

SillyTavern 升级指南:如何更新到新版本且不丢失数据

你花了两周给角色卡调人设、攒了几百条聊天记录,某天想更新一下 SillyTavern 这个 AI 聊天前端,却在命令行前犹豫:万一升完级,聊天记录和角色全没了怎么办?这篇新手教程带你走一遍 SillyTavern 升级的完整流程,保证程序换新、数据原封不动。 [![SillyTavern 升级后角色表情数据完整保留](https://raw.gitcode.com/GitHub_Trending

gitblog_00687的博客 287

npm之安装、更新、卸载本地安装包

npm install <package_name> 下载npm包 在本地目录中如果没有package.json这个文件的话,那么最新版本的包会被安装。 如果存在package.json文件,则会在package.json文件中查找针对这个包所约定的语义化版本规则,然后安装符合此规则的最新版本。 更新本地安装的包 开发过程中,要定期更新应用中依赖的包(package)。因为依赖包的开发者更新了代码,你的应用也就能够获得提升。 为了完成这个任务需要: 在package...

sunnyjingqi的博客 3261

npm上传自己的组件及下载使用

license: (ISC) //你可以在https://spdx.org/licenses/这个地址查阅协议列表 ,可更改,也可以使用默认(直接回车)entry point: (index.js) //指定了程序的主入口文件,可更改,也可以使用默认(直接回车)package name: (testpublish) //包名,可更改,也可以使用默认(直接回车)keywords: //一个字符串数组,方便别人搜索到本模块,可更改,也可以使用默认(直接回车)"description": "演示上传npm包",

weixin_50388521的博客 506
上一篇: [译]自我隔离抗新冠,居家难倒程序猿?
下一篇: 在win10的WSL中设置前端开发环境
云前端
博客等级 码龄17年 101粉丝 113原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值