| 安装nodejs |
1）安装nodejs，
国外下载地址：https://nodejs.org/en/
国内下载地址：http://nodejs.cn/download/
下载16.8.0版本，下载完成后双击【node-v16.8.0-x64.msi】安装。
安装完成后使用 npm -v 命令查看nodejs是否安装成功。
2).配置全局环境变量，
环境配置主要配置的是npm安装的全局模块所在的路径，以及缓存cache的路径，之所以要配置，是因为以后在执行类似：npm install express [-g] （后面的可选参数-g，g代表global全局安装的意思）的安装语句时，会将安装的模块安装到【C:Users用户名AppDataRoaming pm】路径中，占C盘空间，现在要将全局模块安装到指定的位置 。
(1) 配置npm的全局模块的存放路径以及cache的路径，例如两个文件夹放在NodeJS的主目录下，便在D:Program Files odejs下建立【node_global】及【node_cache】两个文件夹，
然后输入以下命令改变npm配置，
npm config set prefix "D:Program Files odejs ode_global" npm config set cache "D:Program Files odejs ode_cache"
(2) 添加系统变量NODE_PATH，变量值为：D:Program Files odejs ode_global ode_modules，此后所安装的模块都会安装到改路径下。
(3) 以管理员权限打开cmd窗口（必须以管理员权限打开），在命令行输入以下命令试着安装express（注：“-g”这个参数意思是装到global目录下，也就是上面说设置的“D:Program Files odejs ode_global”里面。）
npm install express -g
安装完毕后可以看到 D:Program Files odejs ode_global ode_modules 下面有express文件夹及内容了。
4) 在命令行输入node进入编辑模式，输入以下代码检测是否能正常加载模块。
切换到Node命令进入编辑模式
node
输入命令 require('express')
require('express')
看到如下输出说明node能正常加载模块，否则可能是环境变量路径配置不正确。
5）安装cnpm，cnpm是淘宝的npm国内镜像。
npm install -g cnpm --registry=https://registry.npm.taobao.org
添加系统环境变量，变量名：CNPM_PATH，变量值：D:Program Files odejs ode_global ode_modulescnpmin
添加系统环境变量，变量名：NODE_HOME，变量值：D:Program Files odejs
编辑PATH环境变量，追加四项：
%NODE_HOME%
%NODE_HOME%
ode_global
%NODE_PATH%
%CNPM_PATH%
安装完成后，输入cnpm -v 检查 cnpm是否安装成功。
| 安装vue dev-tool |
1）在github下载devtools源码，地址：https://github.com/vuejs/vue-devtools
下载好后解压，打开cmd命令窗口，进入devtools-main文件夹，
【构建vue devtools】有种方法构建vue devtools源码。
第一种方法：通过npm构建
安装npm依赖，构建源码
cnpm install
npm run build
第二种方法：通过yarn构建
如果使用npm构建vue开发者工具失败，需要用yarm安装。
安装yarn
npm install -g yarn
安装前更换淘宝镜像，不然等半天还报错timeout
yarn config set registry https://registry.npm.taobao.org --global yarn config set disturl https://npm.taobao.org/dist --global
查看yarm镜像
yarn config get registry
下载yarn依赖，构建源码
yarn install
yarn run build
构建完成，会在【shells => chrome】下的src文件夹里产生以下几个js文件，就是构建好的devtools插件。
【将构建后的vue devtools插件添加到谷歌浏览器】
打开 谷歌浏览器 => 更多工具 => 扩展程序 => 加载已解压的扩展程序 => 选择刚刚构建好的 【shells => chrome】文件夹，就可以加插件添加到谷歌浏览器。
浏览器右侧工具栏上出现vue小图标，说明vue devtools插件就安装成功了。