Yarn 命令总结

3. 命令总结

• npm install -g yarn

  通过 npm 安装它的竞争对手 yarn 。这个包（yarn）被安装在了 npm 的本地全局仓库。

• yarn -v

  查看包管理器 yarn 的版本信息

• yarn config get registry

  查看包管理器 yarn 的网络仓库网址。

• yarn config set registry http://registry.npm.taobao.org/

  将包管理器 yarn 的网络仓库网址指定为淘宝镜像。

• yarn global add xxx

  通过 yarn 全局安装 xxx 包。这个包被安装在了 yarn 的本地全局仓库。

• yarn global remove xxx

  通过 yarn 卸载全局安装的 xxx 包。在 yarn 的本地全局仓库的 xxx 包会被移除。

• yarn add xxx

  通过 yarn 局部安装 xxx 包。

• yarn remove xxx

通过 yarn 局部卸载 xxx 包。

4. 安装、卸载、配环境

1. yarn 安装 @vue/cli

   我们使用过 npm 安装 @vue/cli（安装路径在 %homepath%\AppData\Roaming\npm\node_modules），自然，我们也可以使用 yarn 全局安装 @vue/cli ：

   yarn global add @vue/cli
   

   @vue/cli 被安装在了 yarn 的本地全局仓库中：

   %homepath%\AppData\Local\Yarn\Data\global\node_modules 。

2. 卸载 npm 的 @vue/cli

注意，此时你的电脑上实际上是有 2 个 @vue/cli ：

• npm 的本地全局仓库中有一个（以前装的）；
• yarn 的本地全局仓库中也有一个（刚刚装的）。

虽然可以，但是为了避免不必要的混淆和麻烦，我们可以『将 npm 安装的 @vue/cli 卸载掉』：

npm uninstall -g @vue/cli

3. 配置 yarn 环境变量

   不过，有可能你的电脑发现不了 yarn 安装的 @vue/cli，你可以通过以下命令验证：

   vue --version
   

   如果没有出现版本信息（命令行输出 vue 命令未找到），那么就说明你的电脑没发现 yarn 安装的 @vue/cli 。

   这是因为 PATH 环境变量没有配置，导致系统/命令行找不到 @vue/cli 的 vue 命令在哪里。

   你可以通过上面的 yarn global bin 到一个路径，它是 yarn 全局安装的软件的可以执行程序位置，形如:

   C:\Users\<用户名>\AppData\Local\Yarn\bin
   

   将它追加到你的环境变量 PATH 中去。<small>配置完后，稳妥起见，重启电脑。</small>

<div style="display: none;">

5. vue-cli 创建的项目使用 Yarn

虽然现在你的 @vue/cli 是通过 yarn 安装的<small>（npm 安装的那个已经被你卸载了）</small>，但是 @vue/cli 『默认使用 NPM 作为包管理器』。

::: tip
如何知道我的 vue-cli 是使用 NPM 作为包管理器的？

当你使用 vue create xxx 创建 vue 项目结束后看到如下信息，那么毫无疑问 vue-cli 使用的就是 NPM：

successfully created project xxx.
Get started with the following commands:
$ cd temp-vue-cli<br>
$ npm run serve 看这里，看这里，看这里

:::

如果有需要，你可以通过设置，去提前『告知』@vue/cli 创建的 vue 项目使用 Yarn 作为包管理器。

无论是通过 npm 还是通过 Yarn 全局安装 @vue/cli，@vue/cli 会在你的用户的『家目录』下创建一个名为 .vuerc 的文件<small>（一开始可能没有，在你第一次执行 vue create 命令后就会被 @vue/cli 创建）</small>。在 Windows 环境中，这个文件在 C:\Users\<用户名> 目录下，即，%homepath% 目录。

用编辑器打开这个文件，你会发现其内容是一个 JSON 格式数据：

{
  "useTaobaoRegistry": false,
  "packageManager": "npm"   // 看这里，看这里，看这里。
  "latestVersion": "4.4.6",
  "lastChecked": 1596095820450,
}

很显然 packageManager 项就是用来设置 @vue/cli 的包管理器的，将它从 npm 改为 yarn 。

另外，这个配置文件中还有一项 useTaobaoRegistry ，表示的是『是否使用淘宝镜像源』，你也可以将这一项改为 true 启用淘宝镜像源，以加快包的下载速度。

修改完成后，使用 vue create xxx 创建 vue 项目，创建过程结束后，你看到的将是：

successfully created project xxx.
Get started with the following commands:

$ cd temp-vue-cli
$ yarn serve

注意，这里的设置对命令行有效，而对 IDEA『无影响』 ，因为在 IDEA 里通过 @vue/cli 创建 vue 项目，它们读取的配置文件是 IDEA 自己的配置文件，并不是这里的这个配置文件，是另外单独的配置。

</div>