包管理工具详解npm、yarn、cnpm、npx 发布npm包 npm install以及npm uninstall各参数含义 package文件和package-lock文件内常见配置含义

1.包查找地址，包地址

2.配置文件  创建（文件名不能有中文）  必须配置 其他配置 及版本号

3.npm命令

4.yarn

5.cnpm

6.npx

7.package-lock.json文件

8.npm i 的查找规则

9.如何发布包

1.包查找地址，包地址

查看下载源 npm config get registry

设置下载源 npm config set registry https://registry.npmmirror.com

包查找地址：https://www.npmjs.org/    包地址：https://registry.npmjs.org/ 如果使用了镜像包地址就是https://registry.npm.taobao.org（淘宝镜像旧地址） https://registry.npmmirror.com（淘宝镜像新地址）

2.配置文件  创建（文件名不能有中文）  基本配置 其他配置 及版本号

1）每个项目都有一个配置文件记录项目的一些参数，我们的配置文件是package.json,我们可以用npm init来创建，但是使用npm之前我们需要先安装node，再安装npm，因为npm是node的包管理工具，所以需要在node环境下使用，但是其实我们安装了node，npm也顺带安装下来了，因此我们只需要安装node即可

2）创建和基本配置：npm init的时候需要我们配置以下参数：

package name: (s) 项目名称       package.json必须要有
version: (1.0.0) 版本号        package.json必须要有
description:项目描述     
entry point: (index.js) 项目入口文件    
test command:测试命令
git repository:git仓库地址
keywords:项目关键词
author:作者 发布包时用到   
license: (ISC)：开源协议 发布包时用到   

创建完后这个文件是这样的：

{
  "name": "s",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

我们也可以用npm init -y进行全部默认值的创建，但是这样创建所在文件不能出现中文名，否则会报错

3）其他配置：main就是上面创建时的entry point，这个是当别人用我们的包的时候，包的入口文件，和webpack自动找的打包入口不冲突

private属性： private属性记录当前的项目是否是私有的； 当值为true时，npm是不能发布它的，这是防止私有项目或模块发布出去的方式；

scripts属性：配置脚本命令  start、 test、stop、restart可以省略掉run

dependencies属性：论开发环境还是生成环境都需要依赖的包

devDependencies属性：生成环境是不需要的

peerDependencies属性： 对等依赖，也就是你依赖的一个包，它必须是以另外一个宿主包为前提的； 比如element-plus是依赖于vue3的，ant design是依赖于react、react-dom；element-plus的package.json里面就会有  "peerDependencies": {    "vue": "^3.2.0"  },在npm2里如果放到 dependencies里面就会在element-plus的node_modules里面重新有vue的安装包，如果我们的项目里也有这个vue依赖，我们项目的node_modules里面也会有vue的依赖，也就是说当我们npm i的时候vue的依赖会被下载两次，一次是我们的项目下面，一次是element-plus下面，如果不放dependencies下面 而是放peerDependencies下面，则会下载vue的包到我们项目下，我们项目下package的vue不会被下载，如果是npm3，则不会下载 element-plus里面的peerDependencies，而是等在安装结束后检查本次安装是否正确，如果不正确会给用户打印警告提示。 另外，在npm3的项目中，可能存在一个问题就是你所依赖的一个package包更新了它peerDependencies的版本，那么你可能也需要在项目的package.json文件中手动更新到正确的版本。否则会出现警告信息。

optionaldependencies：可选依赖，如果有一些依赖包即使安装失败，项目仍然能够运行或者希望npm继续运行，就可以使用optionalDependencies。另外optionalDependencies会覆盖dependencies中的同名依赖包，所以不要在两个地方都写。

engines：用于指定Node和NPM的版本号，安装的过程中，会先检查对应的引擎版本，如果不符合就会报错，也可以指定所在的操作系统 "os" : [ "darwin", "linux" ]

browserslist：配置打包后的JavaScript浏览器的兼容情况，目的是为其它组件提供目标浏览器，比如我们有Autoprefixer（postcss 添加 css 前缀），browserslist会告诉Autoprefixer目标浏览器是哪些，然后Autoprefixer会添加对应浏览器的css前缀

4）版本： 版本规范是X.Y.Z

X主版本号（major）：当你做了不兼容的 API 修改（可能不兼容之前的版本）；

Y次版本号（minor）：当你做了向下兼容的功能性新增（新功能增加，但是兼容之前的版本）；

Z修订号（patch）：当你做了向下兼容的问题修正（没有新功能，修复了之前版本的bug）；

^x.y.z：表示x是保持不变的，y和z永远安装最新的版本；

~x.y.z：表示x和y保持不变的，z永远安装最新的版本；

x.y.z：精确版本

3.npm命令

1)安装分为全局安装和项目安装，项目安装分为dependencies安装，devDependencies安装，optionaldependencies安装

2)全局安装的包都是一些工具包：yarn、webpack等；并不是类似于 axios、express、koa等库文件；所以全局安装了之后并不能让我们在所有的项目中使用 axios等库；

全局安装命令：npm install 包名 -g;

3)项目安装：dependencies安装 ：npm install 包名，npm install 包名 --save-prod,npm install 包名  -P，后面的参数如果不属于任何一种情况就会属于这种情况

devDependencies安装：npm install webpack --save-dev    npm install webpack -D

optionaldependencies安装：npm install 包名 -O,npm install 包名 --save-optional

npm install 包名 --no-save：下载，但是不保存到dependencies和devDependencies和optionaldependencies下 

注意install可以用i代替

4)卸载包

这将卸载软件包，从而完全删除代表该软件包安装的所有 npm。

例：npm uninstall sax

带有命令 -g 或 --global 附加到命令后，是在全局模式下进行的。它将当前软件包上下文作为全局软件包卸载。

npm uninstall 带 3 个排他的，可选的标志，这些标志保存或更新主 package.json 中的软件包版本：

• -S, --save：包将从您的中删除 dependencies。
• -D, --save-dev：包将从您的中删除 devDependencies。
• -O, --save-optional：包将从您的中删除 optionalDependencies。
• --no-save：包不会从 package.json 文件中删除，但是node_module里面会被删除

4.yarn：和npm一样的包管理工具

5.cnpm

npm用的是国外的下载地址，有时候会由于网络问题下载很慢或者下载出错，这时候就可以用淘宝镜像下载，有两种方式用淘宝镜像下载：

第一种：npm config set registry 地址

第二种：使用cnpm，将cnpm设置为淘宝的镜像

 cnpm下载安装失败问题解决 - 灰信网（软件开发博客聚合）

6.npx

1）作用：调用项目中的某个模块的指令

2）在不用npx 如果想看项目的webpack的版本 方式一：在终端中使用如下命令（在项目根目录 下）./node_modules/.bin/webpack --version      方式二：修改package.json中的scripts "scripts": { "webpack": "webpack --version" }   方式三：使用npx  npx webpack --version

3）npx的原理：它会到当前目录的node_modules/.bin目录下查找对应的命令

7.package-lock.json文件

这个文件是用来记录npm install的时候安装的具体依赖版本

package-lock.json文件解析：

name：项目的名称；

version：项目的版本；

lockfileVersion：lock文件的版本；

requires：使用requires来跟踪模块的依赖关系；

dependencies：项目的依赖

当前项目依赖axios，但是axios依赖follow-redireacts；

     axios中的属性如下：

     version表示实际安装的axios的版本；

      resolved用来记录下载的地址，registry仓库中的位置；

     requires记录当前模块的依赖；

      integrity用来从缓存中获取索引，再通过索引去获取压缩包文件；

8.npm i 的查找规则

从npm5开始，npm支持缓存策略（来自yarn的压力）

npm install会检测是有package-lock.json文件：

没有lock文件

分析依赖关系，这是因为我们可能包会依赖其他的包，并且多个包之间会产生相同依赖的情况；

从registry仓库中下载压缩包（如果我们设置了镜像，那么会从镜像服务器下载压缩包）；

获取到压缩包后会对压缩包进行缓存（从npm5开始有的）；

将压缩包解压到项目的node_modules文件夹中（前面我们讲过，require的查找顺序会在该包下面查找）

有lock文件

检测lock中包的版本是否和package.json中一致（会按照semver版本规范检测）；

不一致，那么会重新构建依赖关系，直接会走顶层的流程；

一致的情况下，会去优先查找缓存 a.没有找到，会从registry仓库下载，直接走顶层流程；

b.查找到，会获取缓存中的压缩文件，并且将压缩文件解压到node_modules文件夹中；

9.如何发布包