npm install 安装依赖,为什么有时候会修改项目 package-lock.json,怎么解决?

前端开发时经常会接手一个别人创建的项目已经上线了,后期让我来修复缺陷,或者子新增功能。

上来就使用npm install 安装项目依赖,一看package-lock.json文件被自动修改了,可是我也没有修改package.json文件内容啊,不管了,跑起来试试,居然运行报错,伤心。。。

你们是不是也经常遇到这种情况,怎么解决呢?使用npm ci安装依赖。

为什么使用 npm ci 安装就好了,为什么 npm install 安装依赖,会修改项目的 package-lock.json???接下来就来看看。

npm installnpm ci 有什么区别呢?

npm install,或者 npm i,通常是用来安装依赖项:

  • 它将会安装 Node.js 项目所有的依赖项;
  • 如果使用 ^~ 来匹配依赖项的版本时,则 npm 可能无法安装确切版本;
  • 利用 npm install 安装新依赖项时,会更新 package-lock.json。

npm ci 并不仅仅适用于持续集成系统,在日常开发中,npm ci 非常实用。和 npm install 不同,npm ci 根据 package-lock.json 安装依赖,这可以保证整个开发团队都使用版本完全一致的依赖,避免把时间浪费在排查因为依赖不一致而导致的各种奇怪问题上。

不仅如此,npm ci 还有一个很好的作用,加快 node 模块安装速度 。因为 npm ci 直接根据 package-lock.json 中指定的版本安装,无需计算求解依赖满足问题,在大多数情况下都可以大大加速 node 模块安装过程。

使用 npm ci,会发生:

  • 自动删除 node_modules。当 npm ci 时,如果 node_modules 存在,则自动删除它,这是为了保证一个干净的 node_modules 环境,避免遗留旧版本库的副作用。
  • package-lock.json 必须存在。package-lock.json 用于锁住 package 的版本号,避免在生产环境中因版本导致的构建错误或者运行时错误,就是 npm ci 根据 package-lock.json 安装依赖
  • 不像 npm installnpm ci 不会修改你的 package-lock.json。但是前提是你的项目中有一个 package-lock.json 文件 - 如果你没有这个文件,npm ci 将不起作用,此时必须使用 npm install
  • 不能单独装包。这一条很容易解释,它适用于持续集成环境中,无法单独装包,例如无法仅仅安装 lodash

如果你使用 npm v6+

  • 使用 npm install 安装新的依赖项,或更新现有的依赖项(例如,从版本1到版本2);
  • 在持续集成工具中运行时使用 npm ci,或者某些不修改 package-lock.json 的情况下安装依赖项。

如果你使用 npm v5 或者更低的版本

  • 只能通过 npm install 来安装或者更新依赖项;
  • 尝试升级到最新的 npm 版本。除了npm ci 之外,它还具有 npm audit 命令,可以更轻松地识别和修复依赖项的安全漏洞。此外,使用 npm v6 安装依赖项应该更快。

关于使用 npm ci 的场景,它应该是这样的:

在有 package-lock.json 的项目,我们可以推荐使用 npm ci 来替代 npm install,这样的话,就可以避免一些不必要的麻烦啦。

相关推荐
2501_915918412 小时前
Web 前端可视化开发工具对比 低代码平台、可视化搭建工具、前端可视化编辑器与在线可视化开发环境的实战分析
前端·低代码·ios·小程序·uni-app·编辑器·iphone
程序员的世界你不懂2 小时前
【Flask】测试平台开发,新增说明书编写和展示功能 第二十三篇
java·前端·数据库
索迪迈科技2 小时前
网络请求库——Axios库深度解析
前端·网络·vue.js·北京百思可瑞教育·百思可瑞教育
gnip2 小时前
JavaScript二叉树相关概念
前端
attitude.x3 小时前
PyTorch 动态图的灵活性与实用技巧
前端·人工智能·深度学习
β添砖java3 小时前
CSS3核心技术
前端·css·css3
空山新雨(大队长)4 小时前
HTML第八课:HTML4和HTML5的区别
前端·html·html5
猫头虎-前端技术4 小时前
浏览器兼容性问题全解:CSS 前缀、Grid/Flex 布局兼容方案与跨浏览器调试技巧
前端·css·node.js·bootstrap·ecmascript·css3·媒体
阿珊和她的猫4 小时前
探索 CSS 过渡:打造流畅网页交互体验
前端·css