Node.js安装环境配置与Vue脚手架搭建

Node.js官网：https://nodejs.org/zh-cn/

下载Node.js

点击下载长期维护版：

直接双击刚刚下载的程序，除了更改安装目录以外全程下一步即可。
然后打开控制台查看是否安装成功：

修改模块缓存文件夹

使用npm root -g就可以看到你的全局下载路径在哪里，还有其他的上线环境和开发环境，指令如下图：

首先我们需要修改一下安装目录的权限，方便后续的操作：

我们想要修改它的地方到其他位置，例如我在安装的目录下创建了两个文件夹：

接下来输入指令修改他们的位置：

# 注意是双引号，不是单引号
npm config set prefix "D:\Node.js\node_global"
npm config set cache "D:\Node.js\node_env"

由于安装的时候node.js会自动配置好环境变量，我们需要去修改环境变量，首先找到用户变量下的Path，将最后一行的xxx\npm修改为D:\Node.js\node_global；
然后找到系统变量，添加：

最后在系统变量的Path中添加环境变量：

配置镜像源

淘宝镜像源：

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

查了下还有个镜像源，仅供参考了。 使用npmmirror配置镜像源：https://npmmirror.com/

下面是网站提供的教程：

# cnpm
npm install -g cnpm --registry=https://registry.npmmirror.com

# 或者你直接通过添加 npm 参数 alias 一个新命令:
alias cnpm="npm --registry=https://registry.npmmirror.com \
--cache=$HOME/.npm/.cache/cnpm \
--disturl=https://npmmirror.com/mirrors/node \
--userconfig=$HOME/.cnpmrc"

# Or alias it in .bashrc or .zshrc
$ echo '\n#alias for cnpm\nalias cnpm="npm --registry=https://registry.npmmirror.com \
  --cache=$HOME/.npm/.cache/cnpm \
  --disturl=https://npmmirror.com/mirrors/node \
  --userconfig=$HOME/.cnpmrc"' >> ~/.zshrc && source ~/.zshrc

#查看镜像地址
npm config get registry 

Vue环境搭建

使用的是WebStorm，先配置一下NodeJs的解释器：

首先要安装脚手架：使用命令cnpm install -g vue-cli，安装完后查看一下Vue脚手架是否安装完成：

CD到你的Vue项目目录，使用npm install安装项目所需依赖（一般版本在项目中的package.json中查看）

---

番外篇：Node.js降级

也许有人猜到为什么会有番外篇了。
首先直接通过控制面板卸载Node.js的当前版本。

下载nvm：https://github.com/coreybutler/nvm-windows/releases

双击进行安装，安装过程中选择nvm和nodejs的安装目录。

检查一下安装是否成功：nvm v

再次安装

使用指令查看可以安装的版本：nvm list available
安装对应版本（以本项目为例）：nvm install 16.14.0
然后你就可以在目录下看到你新安装的Nodejs了：