Vue开发环境npm和Yarn的环境变量配置（Windows 10 版）

已搬家至简书：https://www.jianshu.com/p/0d69cb838ae5

一、Nodejs

（1）Nodejs安装

这一步很简单，下载Windows版的Nodejs，进行按照提示安装即可，记得选择将nodejs增加到PATH一项，如果界面上没有，应该就是默认帮你搞定了，可以忽略我这句废话。

通过命令，验证是否安装成：

node -v

npm -v

如果正常显示版本号，即安装成功。

（2）Nodejs配置

Nodejs安装完成之后，默认会将node.exe的路径，添加到系统的环境变量中，如果没有请手动添加。除此之外还要进行其他的配置。

1、配置prefix和cache目录

• 改变npm 全局安装位置

npm config set prefix "你的磁盘路径"

示例目录地址为：C:\Program Files\nodejs

npm config set prefix “C:\Program Files\nodejs\node_global”

• 改变 npm 缓存位置

npm config set cache "你的磁盘路径"

示例目录地址为：C:\Program Files\nodejs

npm config set cache  “C:\Program Files\nodejs\node_cache

2、配置环境变量
右击“计算机”—>“属性”—>“高级系统设置”—>“环境变量”

在"系统变量"中,设置 NODE_PATH
在系统变量里新建 NODE_PATH ,值为

C:\Program Files\nodejs\node_global\node_modules

这个值就是上一步中，通过 “npm config set prefix” 设置的值。可以，用下面命令查看

npm config get prefix

在"用户变量"中,修改path
修改用户变量中的path，添加

C:\Program Files\nodejs\node_global\bin

这个值就是上一步中，通过 “npm config set prefix” 设置的值。

3、配置阿里源

npm config set registry https://registry.npm.taobao.org

二、Yarn

（1）Yarn简介：

yarn是facebook发布的一款取代npm的包管理工具。

yarn的特点：

• 速度超快。Yarn 缓存了每个下载过的包，所以再次使用时无需重复下载。 同时利用并行下载以最大化资源利用率，因此安装速度更快。
• 超级安全。在执行代码之前，Yarn 会通过算法校验每个安装包的完整性。
• 超级可靠。使用详细、简洁的锁文件格式和明确的安装算法，Yarn 能够保证在不同系统上无差异的工作。

（2）Yarn安装

• 方式一：使用npm安装

npm install -g yarn

• 方式二：使用安装文件安装

即在官网中下载exe文件安装（Windows），其它系统根据实际情况安装。

（3）配置prefix和cache目录

• 改变 yarn 全局安装位置

yarn config set global-folder "你的磁盘路径"

示例目录地址为：C:\Program Files\yarn

yarn config  set global-folder "C:\Program Files\yarn\global"

• 改变 yarn 缓存位置

yarn config set cache-folder "你的磁盘路径"

示例目录地址为：C:\Program Files\yarn

yarn config cache-folder "C:\Program Files\yarn\cache"

或者在你的用户目录找到 .yarnrc 的文件，打开它，直接进行编辑

（4）配置环境变量

在我们使用全局安装包的时候，会在 “C:\Program Files\yarn\global”（上面的示例路径，要根据自己的实际情况配置） 下生成 node_modules.bin 目录

我们需要将 C:\Program Files\yarn\global\node_modules.bin 整个目录 添加到系统环境变量中去，否则通过yarn 添加的全局包 在cmd 中是找不到的。

检查当前yarn 的 bin的 位置

yarn global bin

检查当前 yarn 的 全局安装位置

yarn global dir

（5）Yarn 配置阿里源量

1、查看一下当前源

yarn config get registry

2、切换为淘宝源

yarn config set registry https://registry.npm.taobao.org
yarn config set sass_binary_site "https://npm.taobao.org/mirrors/node-sass/"
yarn config set phantomjs_cdnurl "http://cnpmjs.org/downloads"
yarn config set electron_mirror "https://npm.taobao.org/mirrors/electron/"
yarn config set sqlite3_binary_host_mirror "https://foxgis.oss-cn-shanghai.aliyuncs.com/"
yarn config set profiler_binary_host_mirror "https://npm.taobao.org/mirrors/node-inspector/"
yarn config set chromedriver_cdnurl "https://cdn.npm.taobao.org/dist/chromedriver"