npm 和 yarn

npm 的全称是 Node Package Manager（包管理工具），开发者会将自己开发的模块上传到npm 官网，通过 npm install 就可供其他人使用

而 yarn 是为了弥补 npm 的速度慢而出现的

package.json 文件

• 创建 package.json 文件

  npm init --yes
  # 或者
  yarn init --yes
  

• 通过npm install或yarn add后安装的模块就会被记录在 package.json 文件中，如下面的 vue3 项目，提交项目时将 package.json 文件一同提交，当其他人使用时只需npm install，npm 就会自动安装这些需要的包

  "dependencies": {
      "vue": "^3.0.4",
      "axios": "^0.19.0"
    },
    "devDependencies": {
      "vite": "^1.0.0-rc.13",
      "@vue/compiler-sfc": "^3.0.4"
    }
  

• 注意

  可以看到当前"vue": "^3.0.4"版本，3.0.4 代表版本号，3 代表打包本号，0 代表小版本号，4 代表补丁号。版本号最后一位的变化代表 bug 的修复，不会破坏和改变任何已有功能；小版本号的变化代表添加新功能，同样不会破坏和改变任何已有功能，而大版本号改变时说明有较大的改动，需要更新代码来适配新的版本。

  ^符号的意思是向最新版本兼容，就是说npm install时会自动安装大版本号相同的最新的版本，原则上小版本号和补丁号更新不会影响包的功能，但如果因为某些原因影响了，这样就有可能出现问题，有人通过npm install安装时安装完所有的包还是不能正常运行，所以需要一种东西来保证所有人安装的版本是一模一样的，这就是package-lock.json文件

package-lock.json 作用

通过 npm 安装模板后，package-lock.json文件会自动生成，记录更精确的依赖包的各类信息

"axios": {
    "version": "0.19.2",
    "resolved": "https://registry.npm.taobao.org/axios/download/axios-0.19.2.tgz",
    "integrity": "sha1-PqNsXYgY0NX4qKl6bTa4bNwAyyc=",
    "requires": {
        "follow-redirects": "1.5.10"
    }
}

• version：版本
• resolved：下载来源
• integrity：该资源的标准子资源完整性
• requires：依赖包
• ...

这样，通过 npm 安装时不仅会安装相同版本号的包，而且包的下载源都是一样的，这样就保证了每次安装下载的依赖版本都是一样的

yarn.lock 作用

axios@^0.19.0:
  version "0.19.2"
  resolved "https://registry.npm.taobao.org/axios/download/axios-0.19.2.tgz?cache=0&sync_timestamp=1608609215811&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Faxios%2Fdownload%2Faxios-0.19.2.tgz#3ea36c5d8818d0d5f8a8a97a6d36b86cdc00cb27"
  integrity sha1-PqNsXYgY0NX4qKl6bTa4bNwAyyc=
  dependencies:
    follow-redirects "1.5.10"

总的来说yarn.lock和package-lock.json起的作用相同，yarn 就是为了弥补 npm 的缺陷而出现的