2.npm与yarn详细使用

目录

---

Vue专栏目录（点击进入…）

---

---

npm（Node Package Manager，包管理器）

npm通常称为node包管理器，主要功能就是管理node包，包括：安装、卸载、更新、查看、搜索、发布等。Npm是基于couchdb一个数据库，详细记录了每个包的信息（作者、版本、依赖、授权信息等）

为什么使用npm？

npm是一个让JavaScript程序员分享和复用代码的工具。有了它，JS程序员能高效地管理和发布自己要分享的代码。但是进行分享，需要的依赖的代码越来越多，所以用一个工具把这些代码集中到一起来管理；买个服务器作为代码仓库（registry），在里面放所有需要被共享的代码想使用这些代码。使用一些命令进行下载，使用的代码被叫做「包」（package），这就是npm名字的由来：Node Package Manager（包管理器）

npm常用命令

命令	描述
npm install <name>	安装nodejs的依赖包 npm install express 就会默认安装express的最新版本；也可以通过在后面加版本号的方式安装指定版本，如npm install express@3.0.6
npm install <name> -g	将包安装到全局环境中 但是代码中，直接通过require()的方式是没有办法调用全局安装的包的。全局的安装是供命令行使用的，就好像全局安装了vmarket后，就可以在命令行中直接运行vm命令
npm install --save	安装的同时，将信息写入package.json中 项目路径中如果有package.json文件时，直接使用npm install方法就可以根据dependencies配置安装所有的依赖包 这样代码提交到github时，就不用提交node_modules这个文件夹了
npm init	会引导创建一个package.json文件，包括名称、版本、作者这些信息等
npm remove <name>	移除
npm update <name>	更新
npm ls	列出当前安装的了所有包
npm root	查看当前包的安装路径
npm root -g	查看全局的包的安装路径
npm help	帮助，如果要单独查看install命令的帮助，可以使用的npm help install

（1）npm build：构建包

npm build [<package-folder>]	

<package-folder>：package.json根目录中包含文件的文件夹

这是npm link和调用的管道命令npm install。通常应该在安装过程中调用它，但是如果需要直接运行它，请运行：npm run-script build

（2）npm config：管理npm配置文件

npm config set <key> <value> [-g|--global]
npm config get <key>
npm config delete <key>
npm config list [-l] [--json]
npm config edit
npm get <key>
npm set <key> <value> [-g|--global]

子指令
Config支持以下子命令：

命令	详细	描述
set	npm config set key value	将配置键设置为该值。如果省略value，则将其设置为“ true”
get	npm config get key	将配置值回显到stdout
list	npm config list	显示所有配置设置。用于-l显示默认值。用于–json 以json格式显示设置
delete	npm config delete key	从所有配置文件中删除key键
edit	npm config edit	在编辑器中打开配置文件。使用该–global标志来编辑全局配置

（3）npm init：初始化

创建一个package.json文件

npm init [--force|-f|--yes|-y|--scope]
npm init <@scope> (same as `npx <@scope>/create`)
npm init [<@scope>/]<name> (same as `npx [<@scope>/]create-<name>`)

生成它时不会问任何问题，即全部使用默认值

npm init -y

如果省略了初始化程序（仅通过调用npm init），则init将退回到传统的init行为。它会问很多问题，然后编写一个package.json。它将尝试根据现有字段，依赖项和选择的选项做出合理的猜测。它是严格加法的，因此它将保留所有已设置的字段和值。也可以使用-y/–yes完全跳过问题，创建一个默认的package.json。如果通过–scope，它将创建一个有范围的包

（4）npm install：安装套件

此命令将安装软件包及其依赖的任何软件包。如果程序包具有程序包锁定或收缩包装文件，则依赖项的安装将由该程序驱动

npm install (with no args, in package dir)
npm install [<@scope>/]<name>
npm install [<@scope>/]<name>@<tag>
npm install [<@scope>/]<name>@<version>
npm install [<@scope>/]<name>@<version range>
npm install <alias>@npm:<name>
npm install <git-host>:<git-user>/<repo-name>
npm install <git repo url>
npm install <tarball file>
npm install <tarball url>
npm install <folder>

别名：npm i，npm add
常用选项：[- P | --save-prod | -D | --save-dev | -O | --save-optional ] [ -E | --save-exact ] [ -B | --save-bundle ] [ --no-save ] [ --dry-run ]

npm install默认将任何指定的软件包保存到“dependencies”中。可以控制它们的保存位置和保存方式
其他标志参数：

参数	描述
-P，–save-prod	安装包将出现在的“dependencies”中。这是除非存在-D或-O，否则为默认值
-D，–save-dev	安装包将出现在的“devDependencies”中
-O，–save-optional	安装包将出现在您的“optionalDependencies”中
–no-save	防止保存为“dependencies”

使用上述任何选项将依赖项保存到package.json，还有两个附加的可选标志：

可选参数	描述
-E，–save-exact	保存的依赖项将使用确切的版本，而不是使用npm的默认semver范围操作员
-B，–save-bundle	保存的依赖项也将添加到“bundleDependencies”列表中
此外，如果有“npm-shrinkwrap.json”或“package-lock.json”，那么它也会更新

（5）npm start ：npm开始打包

npm start [ - < args > ]

这将运行在“start”其“scripts”对象的包属性中指定的任意命令。如果“start”在“scripts”对象上未指定任何属性 ，它将运行node server.js

（6）npm stop：npm停止

npm stop [ - < args > ]

如果提供了程序包，它将运行程序包的“停止”脚本

（7）npm update：npm更新

npm update [-g] [<pkg>...]

别名: up，upgrade

该命令会将所有列出的软件包更新到最新版本（由tagconfig指定），同时注意使用semver。它还将安装缺少的软件包。与所有安装软件包的命令一样，该–dev标志也会引起devDependencies处理。

如果-g指定了该标志，则此命令将更新全局安装的软件包。
如果未指定软件包名称，则将更新指定位置（全局或本地）中的所有软件包。

从开始npm@2.6.1，npm update只会检查顶级软件包。的先前版本npm也会递归检查所有依赖项。要获取旧的行为，请使用npm --depth 9999 update。
从开始npm@5.0.0，npm update将更package.json改为将新版本保存为所需的最低依赖关系。要获取旧的行为，请使用npm update --no-save

yarn（Yet Another Resource Negotiator，另一种资源协调者）

Yarn是由Facebook、Google、Exponent 和 Tilde 联合推出发布的一款取代npm的包管理工具

yarn与npm没有本质的区别都是包管理工具. 但是Yarn一开始的主要目标是解决：语义版本控制而导致的npm安装的不确定性问题。虽然可以使用npm shrinkwrap来实现可预测的依赖关系树，但它并不是默认选项，而是取决于所有的开发人员知道并且启用这个选项。它是一个新的 CLI 工具，拉取的 packages 依然来自npm仓库。仓库本身不会变，所以获取或者发布模块的时候和原来一样。

为什么要使用yarn？

yarn具有并行安装的功能，装包耗时十分少；其在运行的时候输出更为的简洁，Yarn要比npm更好用：默认就有锁定文件、更快速地安装依赖以及依赖的更新会自动同步到package.json文件中。从npm迁移到Yarn成本几乎为零

使用npm install的时候巨慢。特别是新的项目拉下来要等半天，删除node_modules，重新install的时候依旧如此

同一个项目，安装的时候无法保持一致性。由于package.json文件中版本号的特点，下面三个版本号在安装的时候代表不同的含义

"5.0.3",
"~5.0.3",
"^5.0.3"

版本	描述
5.0.3	表示安装指定的5.0.3版本
～5.0.3	表示安装5.0.X中最新的版本
^5.0.3	表示安装5.X.X中最新的版本

这就麻烦了，常常会出现同一个项目，有的同事是OK的，有的同事会由于安装的版本不一致出现bug。
安装的时候，包会在同一时间下载和安装，中途某个时候，一个包抛出了一个错误，但是npm会继续下载和安装包。因为npm会把所有的日志输出到终端，有关错误包的错误信息就会在一大堆npm打印的警告中丢失掉，并且你甚至永远不会注意到实际发生的错误

yarn特点

（1）速度超快

Yarn缓存了每个下载过的包，所以再次使用时无需重复下载。 同时利用并行下载以最大化资源利用率，因此安装速度更快

①并行安装

无论npm还是Yarn在执行包的安装时，都会执行一系列任务。npm是按照队列执行每个package，也就是说必须要等到当前package安装完成之后，才能继续后面的安装。而Yarn是同步执行所有任务，提高了性能

②离线模式

如果之前已经安装过一个软件包，用Yarn再次安装时之间从缓存中获取，就不用像npm那样再从网络下载了

（2）超级安全、超级可靠

在执行代码之前，Yarn会通过算法校验每个安装包的完整性
使用详细、简洁的锁文件格式和明确的安装算法，Yarn 能够保证在不同系统上无差异的工作

（3）安装版本统一

为了防止拉取到不同的版本，Yarn有一个锁定文件（lock file）记录了被确切安装上的模块的版本号。每次只要新增了一个模块，Yarn就会创建（或更新）yarn.lock这个文件。这么做就保证了，每一次拉取同一个项目依赖时，使用的都是一样的模块版本。npm其实也有办法实现处处使用相同版本的packages，但需要开发者执行npm shrinkwrap命令。这个命令将会生成一个锁定文件，在执行npm install的时候，该锁定文件会先被读取，和Yarn读取yarn.lock文件一个道理。npm和Yarn两者的不同之处在于，Yarn默认会生成这样的锁定文件，而npm要通过shrinkwrap命令生成npm-shrinkwrap.json文件，只有当这个文件存在的时候，packages版本信息才会被记录和更新

（4）更简洁的输出

npm的输出信息比较冗长。在执行npm install 的时候，命令行里会不断地打印出所有被安装上的依赖。相比之下，Yarn简洁太多：默认情况下，结合了emoji直观且直接地打印出必要的信息，也提供了一些命令供开发者查询额外的安装信息

（5）多注册来源处理

所有的依赖包，不管它被不同的库间接关联引用多少次，安装这个包时，只会从一个注册来源去装，要么是npm要么是bower，防止出现混乱不一致

（6）更好的语义化

yarn改变了一些npm命令的名称，比如yarn add/remove，感觉上比npm原本的install/uninstall要更清晰

安装yarn

1.命令安装

npm install -g yarn --registry=https://registry.npm.taobao.org

查看版本：yarn --version

2.配置环境

命令	描述
yarn global bin	查找yarn安装目录

yarn常用命令

（1）yarn init：初始化项目

命令	描述
yarn init	初始化项目
同npm init，执行输入信息后，会生成package.json文件

（2）yarn config：yarn配置项

命令	描述
yarn config list	显示所有配置项
yarn config get <key>	显示某配置项
yarn config delete <key>	删除某配置项
yarn config set <key> <value> [-g 或 --global]	设置配置项

（3）yarn install：安装包

命令	描述
yarn install	安装package.json里所有包，并将包及它的所有依赖项保存进yarn.lock
yarn install --flat	安装一个包的单一版本
yarn install --force	强制重新下载所有包
yarn install --production	只安装dependencies里的包
yarn install --no-lockfile	不读取或生成yarn.lock
yarn install --pure-lockfile	不生成yarn.lock
yarn --version/yarn -V	查看版本号

（4）yarn add：添加包

注意：会更新package.json和yarn.lock

命令	描述
yarn add [package]	在当前的项目中添加一个依赖包，会自动更新到package.json和yarn.lock文件中
yarn add [package]@[version]	安装指定版本，这里指的是主要版本，如果需要精确到小版本，使用-E参数
yarn add [package]@[tag]	安装某个tag（比如beta,next或者latest）

不指定依赖类型默认安装到dependencies（生产）里，也可以指定依赖类型：

命令	描述
yarn add --dev/-D	添加到devDependencies（开发）
yarn add --peer/-P	添加到peerDependencies
yarn add --optional/-O	加到optionalDependencies

默认安装包的主要版本里的最新版本，可以指定版本：

命令	描述
yarn add --exact/-E	安装包的精确版本。 例如：yarn add foo@1.2.3会接受1.9.1版，但是yarn add foo@1.2.3 --exact只会接受1.2.3版
yarn add --tilde/-T	安装包的次要版本里的最新版。例如yarn add foo@1.2.3 --tilde会接受1.2.9，但不接受1.3.0

（5）其他命令

命令	描述
yarn publish	发布包
yarn remove <packageName>	移除一个包 移除一个包，会自动更新package.json和yarn.lock
yarn upgrade	更新一个依赖 用于更新包到基于规范范围的最新版本
yarn run	运行脚本 用来执行在package.json中scripts属性下定义的脚本
yarn info <packageName>	显示某个包的信息 可以用来查看某个模块的最新版本信息
yarn cache	缓存
yarn cache list	列出已缓存的每个包
yarn cache dir	返回全局缓存位置
yarn cache clean	清除缓存

yarn解决npm相关问题
npm模块的依赖：npm存在一些历史遗留问题

比如：项目模块依赖是图中描述的，@1.2.1代表这个模块的版本。在安装A的时候需要安装依赖C和D，很多依赖不会指定版本号，默认会安装最新的版本，这样就会出现问题：比如今天安装模块的时候C和D是某一个版本，而当以后C、D更新的时候，再次安装模块就会安装C和D的最新版本，如果新的版本无法兼容这个项目，程序可能就会出BUG，甚至无法运行。这就是npm的弊端，而yarn为了解决这个问题推出了yarn.lock的机制，也就是项目中的yarn.lock文件

yarn.lock文件格式

Yarn.lock文件已经把依赖模块的版本号全部锁定，当执行yarn install（npm）的时候，yarn会读取这个文件获得依赖的版本号，然后依照这个版本号去安装对应的依赖模块，这样依赖就会被锁定，以后再也不用担心版本号的问题了。其他人或者其他环境下使用的时候，把这个yarn.lock拷贝到相应的环境项目下再安装即可

注意：这个文件不要手动修改它，当使用一些操作如yarn add时，yarn会自动更新yarn.lock

使用yrm管理yarn registry（下载源）

yrm工具可以很方便地管理一些npm源。无需使用yarn config set registry切来切去

1.安装yrm

npm install -g yrm
yarn add -g yrm

2.列出所有可用源

yrm ls

3.选择一个源

yrm use yarn

这里用了yarn官方源，速度比淘宝还快

rimraf

快速删除node_modules，手动删除真的很慢！！！

安装：

npm install rimraf -g

删除node_modules：

rimraf node_modules

rimraf是node的一个包，可以快速删除node_modules，再也不用等半天了

因为yarn的服务器是在国外，所以要提高下载包速度，得使用镜像改变源地址；可以使用yrm来做yarn的镜像管理器；首先需要下载，使用如下命令下载安装

npm i yrm -g

4.查看下载源地址（镜像地址）

之后可以通过以下命令来查看所提供的镜像地址

yrm ls

可以看到

5.在npm使用

现在的源地址是taobao，可以使用“yrm use 镜像”来切换镜像源

切换npm镜像

yrm use npm

可以看到

YARN Registry has been set to: https://registry.npm.taobao.org/
NPM Registry has been set to: https://registry.npm.taobao.org/

npm与yarn命令比较

npm	yarn	说明
npm init	yarn init	初始化某个项目
npm install/link	yarn install/link	默认的安装依赖操作
npm install taco --save	yarn add taco	安装某个依赖，并默认保存到package
npm uninstall taco --save	yarn remove taco	移除某个依赖项目
npm install taco --save-dev	yarn add taco --dev	安装某个开发时依赖项目
npm update taco --save	yarn upgrade taco	更新某个依赖项目
npm install taco --global	yarn golbal add taco	安装某个全局依赖项目
npm publish/login/logout	yarn publish/login/logout	发布/登录/登出，一系列NPM Registry操作
npm run/test	yarn run/test	运行某个命令

yarn	npm/cnpm	描述
yarn --version	npm -version（或者 node -v）	查看版本
yarn init	npm init	初始化某个项目
yarn install	cnpm install	默认安装项目依赖
yarn add xxx	cnpm install xxx --save	安装某个依赖，并且默认保存到package
yarn remove xxx	cnpm uninstall xxx --save	卸载某个项目依赖
yarn upgrade xxx	cnpm update xxx --save	更新某个项目依赖
yarn global add xxx	cnpm install xxx -g	安装某个全局的项目依赖
yarn add xxx@	cnpm install xxx@1.2.33 --save	安装某个特定版本号的项目依赖
yarn publish/login/logout	npm publish/login/logout	发布/登录/登出，一系列npm registry操作
yarn run/test	npm run/test	运行某个命令
yarn config set registry ‘https://registry.npm.taobao.org’	npm install -g cnpm --registry=http://registry.npm.taobao.org	安装淘宝镜像