Vue package-lock.json的作用及说明

vue package-lock.json的作用

package-lock.json有什么作用呢？

简单理解就是锁定dependencies的版本号。

一般来说前端的项目都有一个package.json文件管理依赖的版本号，在package.json文件里我们可以看到依赖的版本号前面一半有^和~这些符号。

• ^：锁定大版本号，比如是^6.2.2，会匹配所有6.x.x的版本，更新的时候会下载最新的版本号
• ~：锁定前面两个版本号，比如是^6.2.2，会匹配所有6.2.x的版本，更新的时候会下载最新的版本号
• *：安装最新的版本号。

不同的下载时间、npm下载源不一样或者不同机器，下载得到的nodejs依赖包有可能不一样。

所以这时候package-lock.json的作用就出来了。

它就是固定当前的版本，确保你安装的包不会因为在新的机器上或者新的

下载源下载依赖包时不一致，这在开发、部署或者多人协作时会减少很多不必要的麻烦。

我们举个例子

当前测试的project的依赖如下

  "devDependencies": {
    "dayjs": "~1.9.4",
    "file-saver": "^1.2.0",
    "lodash": "*"
  },

一般来说新建的项目是没有package-lock.json这个文件，执行npm install时候它会自动生成。

执行npm install后，我们去node-modules目录看下这三个包的版本号。

    "dayjs": "1.9.8",
    "file-saver": "1.3.8",
    "lodash": "4.17.21"

再看下生成的package-lock.json文件

 "dependencies": {
    "dayjs": {
      "version": "1.9.8",
     "dev": true
    },
    "file-saver": {
      "version": "1.3.8",
      "dev": true
    },
    "lodash": {
      "version": "4.17.21",
      "dev": true
    }
  }

node_module依赖包的版本和package-lock.json的版本号是一样的。

dayjs匹配到了1.9.x的最新版本，file-saver匹配到了1.x.x的最新版本，lodash匹配到了最新的版本。

当我们需要去更新依赖包的版本时，可以通过执行npm install xxx@x.x.x实现，package-lock.json也会随之更新。

我本地的npm版本是6.10.2，在package.json中直接修改版本号，然后npm install，也可以实现依赖包的版本和package-lock.json更新。

网上有说法是5版本后不支持这种改法了。

如果下载依赖用的是yarn install，那用的就是yarn.lock文件。

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。