包管理器

包管理器

​ 随着我们项目的复杂的提升，在开发中我们不可能所有的代码都要手动一行一行的编写，于是我们就需要将一些现成写好的代码引入到我们的项目中来帮助我们完成开发，就像是我们之前使用jQuery，我们称之为包，越是复杂的项目，其中需要的包就越多，那我们如何下载包，删除包，更新包？

1.NPM#

​ node中的包管理器叫npm(node package manage),由npm网站，npm cli和仓库组成

1. npm的下载

   1. npm在我们下载完node就一起安装好了，我们可以直接在命令行中执行npm -v来查看npm是否安装成功
   2. 在说npm包的使用，我们先了解一下package.json这个配置文件

2. package.json

   1. 它是一个包的描述文件，就是包的各种信息都在这个里面，如版本，包名，依赖等

      {
        "name": "my-awesome-package"，
        "version": "1.0.0"，
        "description": "我的包的概要简短描述"，
        "license": "MIT",
      }
      还有很多，请看下面：
      

2.package.json#

1. 重要字段

   1. 规则：

      1. 必须小于或等于214个字符(包括@scope/范围包)
      2. 不能以点(.)或者下划线(_)开头
      3. 名称中不得包含大写字母
      4. 必须仅使用URL安全字符

   2. //name
      {
        "name": "my-awesome-package"
      }	
      

   3. //version
      {
        "version": "1.0.0"
      }
      

   4. Tips：

      1. 不要使用和Node.js核心模块相同的名字
      2. 不要在名字里包含js或者node单词
      3. 短小精悍，让人看到名字就大概了解包的功能，记住它也会被用在require()调用里
      4. 保证名字的唯一性
      5. name和version字段一起用于创建唯一ID

   5. 安装包

      1. npm install [包名]
      2. yarn add [包名]
      3. 安装之后存放在node_modules/[包名]

2. 信息类字段

   1. description

      1. 帮助使用者了解包的功能的字符串，包管理器也会把这个字符串作为搜索关键词。

      {
        "description": "我的包的概要简短描述"
      }
      

   2. license

      1. 所有包都应该指定许可证，以便让用户了解他们是在什么授权下使用此包，以及此包还有哪些附加限制。

      {
        "license": "MIT",
        "license": "(MIT or GPL-3.0)",
        "license": "SEE LICENSE IN LICENSE_FILENAME.txt",
        "license": "UNLICENSED"
      }
      

   3. keywords

      1. 一个字符串数组，当在包管理器里搜索包时很有用。

      {
        "keywords": [
          "short", "relevant", "keywords"
        ]
      }
      

3. 链接类字段

   1. 各种指向项目文档、issues 上报，以及代码托管网站的链接字段。

   2. homepage

      1. 是包的项目主页或者文档首页。

      {
        "homepage": "https://your-package.org"
      }
      

   3. repository

      1. 包的实际代码所在的位置。

      {
        "repository": {
          "type": "git", "url": "https://github.com/user/repo.git"
        },
        "repository": "github:user/repo",
        "repository": "gitlab:user/repo",
        "repository": "bitbucket:user/repo",
        "repository": "gist:a1b2c3d4e5f"
      }
      

   4. bugs

      1. 问题反馈系统的 URL，或者是 email 地址之类的链接。用户通过该途径向你反馈问题。

      {
        "bugs": "https://github.com/user/repo/issues"
      }
      

4. 项目维护类字段

   1. 项目的维护者。

   2. author

      1. 作者信息，一个人。

      {
        "author": {
          "name": "Your Name",
          "email": "you@xxx.com",
          "url": "http://your-x.com"
        },
        "author": "Your Name  (http://your-x.com)"
      }
      

   3. contributors

      1. 贡献者信息，可能很多人。

      {
        "contributors": [
          { "name": "Your Friend", "email": "friend@xxx.com", "url": "http://friends-xx.com" }
          { "name": "Other Friend", "email": "other@xxx.com", "url": "http://other-xx.com" }
        ],
        "contributors": [
          "Your Friend  (http://friends-xx.com)",
          "Other Friend  (http://other-xx.com)"
        ]
      }
      

5. 文件类信息

   1. 指定包含在项目中的文件，以及项目的入口文件。

   2. files

      1. 项目包含的文件，可以是单独的文件、整个文件夹，或者通配符匹配到的文件。

      {
        "files": [
          "filename.js",
          "directory/",
          "glob/*.{js,json}"
        ]
      }
      

   3. main

      1. 项目的入口文件。

      {
        "main": "filename.js"
      }
      

   4. man

      1. 项目的入口文件。

      {
        "man": "./man/doc.1",
        "man": ["./man/doc.1", "./man/doc.2"]
      }
      

   5. directories

      1. 当你的包安装时，你可以指定确切的位置来放二进制文件、man pages、文档、例子等。

      {
        "directories": {
          "lib": "path/to/lib/",
          "bin": "path/to/bin/",
          "man": "path/to/man/",
          "doc": "path/to/doc/",
          "example": "path/to/example/"
        }
      }
      

   6. bin

      1. 随着项目一起被安装的可执行文件。

      {
        "bin": "bin.js",
        "bin": {
          "命令名称": "bin/命令路径/命令名称.js",
          "other-command": "bin/other-command"
        }
      }
      

6. 打包包字段

   1. 简短说明一下

      1. esnext：ES模块中使用阶段4功能（或更旧版本）的源代码，未编译。

      2. main：指向一个CommonJS模块（或UMD模块），其 JavaScript 与 Node.js 当前可以处理的一样现代。

      3. 大多数 module 用例应该可以通过 esnext 处理。

      4. browser 可以通过 esnext 的扩展版本来处理

      5. 另请参阅：通过 npm 交付未编译的源代码

      {
        "main": "main.js",
        "esnext": {
          "main": "main-esnext.js",
          "browser": "browser-specific-main-esnext.js"
        }
      }
      

   2. module

      1. 支持：rollup, webpack

      2. {
           "module": "dist/my-package.esm.js"
         }
         

   3. browser

      1. 作为 JavaScript 包或组件工具的提示，在这里。

      2. "browser": {
             "module-a": "./shims/module-a.js",
             "./server/only.js": "./shims/client-only.js"
         }
         

7. 任务类字段

   1. 包里还可以包含一些可执行脚本或者其他配置信息。

   2. scripts

      1. 脚本是定义自动化开发相关任务的好方法，比如使用一些简单的构建过程或开发工具。 在 scripts 字段里定义的脚本，可以通过 yarn run 命令来执行。 例如，上述 build-project 脚本可以通过 yarn run build-project 调用，并执行 node build-project.js。

         有一些特殊的脚本名称。 如果定义了 preinstall 脚本，它会在包安装前被调用。 出于兼容性考虑，install、postinstall 和 prepublish 脚本会在包完成安装后被调用。

         start 脚本的默认值为 node server.js。

         参考文档：npm docs

      2. {
           "scripts": {
             "build-project": "node build-project.js"
           }
         }
         

   3. 特定的scripts

      1. 参考文档：npm docs.

   4. config

      1. 配置你的脚本的选项或参数。

      {
        "config": {
          "port": "8080"
        }
      }
      

      2. 配置中的键作为环境变量公开给脚本(scripts)。

      {
        "scripts": {
          "run": "echo $npm_package_config_port"
        }
      }
      

8. 依赖描述类字段

   1. 你的包很可能依赖其他包。你可以在你的 package.json 文件里指定那些依赖。

   2. dependencies

      1. 这些是你的包的开发版和发布版都需要的依赖。

      {
        "dependencies": {
          "colors":   "*",
          "foo": "1.0.0 - 2.9999.9999",
          "bar": ">=1.0.2 <2.1.2",
          "baz": ">1.0.2 <=2.3.4",
          "boo": "2.0.1",
          "qux": "<1.0.0 || >=2.3.1 <2.4.5 || >=2.5.2 <3.0.0",
          "asd": "http://asdf.com/asdf.tar.gz",
          "til": "~1.2",
          "elf": "~1.2.3",
          "two": "2.x",
          "thr": "3.3.x",
          "lat": "latest",
          "dyl": "file:./path/to/dyl",
          "pla": "https://github.com/user/project/tarball/branch",
          "stu": "git://github.com/user/project.git#commit-ish"
        }
      }
      

   3. devDependencies

      1. 这些是只在你的包开发期间需要，但是生产环境不会被安装的包。

      {
        "devDependencies": {
          "package-2": "^0.4.2"
        }
      }
      

   4. ``peerDependencies`

      1. 平行依赖允许你说明你的包和其他包版本的兼容性。添加可选设置以消除丢失的对等依赖性警告，#6671 。

      {
        "peerDependencies": {
          "package-3": "^2.7.18"
        }
      }
      

   5. optionalDependencies

      1. 可选依赖可以用于你的包，但不是必需的。如果可选包没有找到，安装还可以继续。

      {
        "optionalDependencies": {
          "package-5": "^1.6.1"
        }
      }
      

   6. bundledDependencies

      1. 打包依赖是发布你的包时将会一起打包的一个包名数组。

      {
        "bundledDependencies": [
          "package-4"
        ]
      }
      

   7. ``peerDependenciesMeta`

      1. 它允许对等依赖项标记为可选

      {
        "peerDependenciesMeta": {
          "node-sass": {
            "optional": true
          },
          "sass": {
            "optional": true
          },
          "fibers": {
            "optional": true
          }
        }
      }
      

   以上就是package.json的部分配置了，可以参考npm docs. 那我们继续来说npm

1.NPM#

​ 通常情况下，我们的自己创建的每个node项目，都可以被认为是一个包，都应该为其创建package.json描述文件，我们的npm在创建package.json文件，只需要进入项目，输入 npm init，就可以进入到交互界面，来输入指定信息，创建包，我们一般通过npm init -y直接默认来创建package.json，无论怎么样，创建一个即可,如果想要查看完整命令：

​ npm 仓库、网站和命令行界面的文档

​ npmmirror 中国镜像站

1. 安装包

   1. 安装命令为npm i <包名>

      我们执行一下npm i lodash安装一个包

   2. 1.首先我们看到的，调用后它会自动连接npm服务器，将最新的loadsh包下载到项目的node_modules目录下，如果目录不存在下载包时会自动创建。

   3. 它会修改package.json文件，在dependencies字段中将刚刚下载的包设置为依赖项

      "dependencies": {
          "lodash": "^4.17.21"
       }
      

   4. 可以指定版本进行安装

      1. npm install lodash@3.2.0

      2. npm install lodash@"> 3.2.0"

   5. 如果不希望，包出现在package.json的依赖中，可以添加–no-save指令禁止, 也可以通过-D或–save-dev，将其添加到开发依赖

   6. npm install lodash --no-save

   7. npm install lodash -D

   8. 安装包后项目中会自动生成package.lock.json文件，这个文件主要是用来记录当前项目的下包的结构和版本的，提升重新下载包的速度，以及确保包的版本正确。

   9. 列出此软件中所有依赖项的已安装版本

   10. npm list

2. 全局安装包

   1. 全局安装指，直接将包安装到计算机本地，通常全局安装的都是一些命令行工具，全局安装后工具使用起来也会更加便利。全局安装只需要在执行install指令时添加-g指令即可。
   2. npm i <包名> -g

3. 卸载包

   1. 可以通过 npm uninstall <包名>或者npm un <包名>

4. 配置镜像

   1. 第一种是使用cnpm的形式，不太推荐
      1. npm install -g cnpm --registry=https://registry.npmmirror.com
      2. 安装完成后，便可以通过cnpm命令来安装包。
   2. 第二种是直接修改npm的地址为镜像地址
      1. npm set registry https://registry.npmmirror.com
   3. 如果想恢复到原版的配置，可以执行以下命令:
   4. npm config delete registry

2.Yarn#

早期的npm存在有诸多问题，不是非常的好用。yarn的出现就是为了帮助我们解决npm中的各种问题 

​ 在新版本的node中，corepack中已经包含了yarn，可以通过启用corepack的方式使yarn启用。首先执行以下命令启用corepack ：

corepack enable

查看yarn的版本

yarn -v

切换yarn版本，最新版：

corepack prepare yarn@stable --activate

切换为1.x.x的版本

corepack prepare yarn@1 --activate	

命令#

yarn init （初始化，创建package.json）

yarn add xxx（添加依赖）

yarn add xxx -D（添加开发依赖）

yarn remove xxx（移除包）

yarn（自动安装依赖）

yarn run（执行自定义脚本）

yarn <指令>（执行自定义脚本）

yarn global add（全局安装）

yarn global remove（全局移除）

yarn global bin（全局安装目录）

Yarn镜像配置#

配置：

yarn config set registry https://registry.npmmirror.com

恢复：

yarn config delete registry

Pnpm#

pnpm又是一款node中的包管理器，我真的不想在介绍了。但是想想还是说一下吧，毕竟也不难。作为初学者的你，npm、yarn和pnpm选一个学一学就可以了。

安装#

npm install -g pnpm

命令#

pnpm init（初始化项目，添加package.json）

pnpm add xxx（添加依赖）

pnpm add -D xxx（添加开发依赖）

pnpm add -g xxx（添加全局包）

pnpm install（安装依赖）

pnpm remove xxx（移除包）

Pnpm镜像配置#

配置：

pnpm config set registry https://registry.npmmirror.com

恢复：

pnpm config delete registry

• npm 备忘清单
• Yarn 官方文档网站
• Yarn 2 中文文档网站
• Yarn 1 中文文档网站