安装配置环境 vscode + Nodejs_vscode nodejs

1. 安装vscode

从官网下载所需版本，逐步安装，不再过多介绍。

官网：https://code.visualstudio.com/Download

2. 安装并配置Node.js

第一步：下载

根据需求下载所需版本或者稳定版本，没必要下载最新版，最新版可能会存在不稳定的问题。由于项目需要，我安装的是14.18.1版本（下图仅为示例）。

Node.js下载官方地址：https://nodejs.org/en/download/

第二步：安装测试

安装：

 1）下载后双击安装，一直点击下一步；
 2）点击change按钮，更换到自己的指定安装位置XX，点击下一步（不修改默认位置也是可以的 ）；
 3）继续点击下一步，最后安装结束即可。
1
2
3

安装完成后系统目录如图所示（其中，npm随安装程序自动安装，作用就是对Node.js依赖的包进行管理）

测试：

win+R打开调出运行，输入cmd，分别输入node -v和npm -v，测试node是否安装成功，也可以查看node版本及其相应的npm版本。

第三步：配置环境

因为在执行例如npm install -g vue-cli等命令全局安装的时候，默认会将模块安装在C:\Users\用户名\AppData\Roaming路径下的npm和npm_cache中，不方便管理且占用C盘空间，

所以这里配置自定义的全局模块安装目录，在node.js安装目录下新建两个文件夹 node_global和node_cache，如图所示：

在CMD中执行下面两行：

npm config set prefix "D:\XX\node_global"

npm config set cache "D:\XX\node_cache"
1
2
3

执行完成后，配置环境变量：在电脑搜索“查看系统高级设置”，

• “环境变量” -> “系统变量”：新建一个变量名为 “NODE_PATH”， 值为“D:\XX\node_global\node_modules”，如下图：

• “环境变量” -> “用户变量”：编辑用户变量里的Path，将相应npm的路径（“C:\Users\用户名\AppData\Roaming\npm”）改为：“D:\xx\node_global”，如下：

测试：配置完成后，在以管理员身份运行cmd，执行下行代码，安装淘宝镜像：

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

输入cnpm -v,测试镜像是否安装成功。

最后执行npm install -g vue-cli全局安装vue/cli脚手架，由于我后期还需要安装cesium，高版本的脚手架在项目打包过程中容易出现问题，所以我这里npm install -g @vue/cli@4.5.17，安装完成后执行vue -V查看脚手架版本，如图即代表成功。