Windows下搭建vue 4.X开发环境——@vue/cli或vue-cli4

如何在windows下搭建vue4.x开发环境，主要是vue-cli4 脚手架的，看完就知道如何搞了。

第一步：安装node.js
官网 http://nodejs.cn/download/
下载12.18.3版本 https://npm.taobao.org/mirrors/node/v12.18.3/

第二步：下载完成后，直接双击安装包（.exe），接下来按照图片走就OK了



邻上图中的选择是默认的，默认已经选好了这四个。

邻上图表示正在安装。
第三步：设置node的全局路径和缓存路径
安装完成后，在安装的根目录下创建两个文件夹node_cache、node_global

设置缓存路径，如下图

设置全局模块存放路径，如下图

第四步：安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org
第五步：设置环境变量
最后点击确认。其目的是在任何目录都可以执行node和vue命令。
新建NODE_PATH
第六步：安装vue
需先关闭命令行窗口，再次打开cmd，执行安装命令 cnpm install vue -g

安装完成。说明下为什么关闭命令行窗口，是因为不关闭的话，命令行窗口还是在之前的path路径中，我们这里的path路径发生了变化，所以要关闭，快捷键ctrl+R重新打开cmd命令行窗口。
第七步：安装vue-cli脚手架
注意：2.0版本的和3.0版本之后的安装方法是不同的
安装vue@cli脚手架 npm install -g vue@cli

这一步如果报错。
解决方法一：npm i @vue/cli -g 后，再cnpm i @vue/cli
解决方法二：可能是cnpm未安装，npm install -g cnpm重新安装

就可以了。然后cnpm install -g vue@cli 如果执行该命令时报错，可能是写法错，改为cnpm install -g vue-cli 安装就可以了（正如：我上面说的安装方法不同。我是按照视频安装，结果就卡到了，然后就改为cnpm install -g vue-cli 试了下，结果好了），安装成功后
更新npm（这步可以省略）

第八步：安装vue cnpm install vue -g

第九步：查看vue版本 vue -V 这一步主要是为了查看你是否安装vue成功

第十步：创建项目 先在cmd里切换到“想将项目first安装的位置”，然后 vue create firsty
到这就完成了。

说真的，我最近安装vue-cli4时遇到了好多的问题，找到的资料全是2.x或3.x的，难受的啊，因为做项目赶进度，老是出错，结果今天找了一天，找了一个讲解vue-cli4的视频，好好看—windows下搭建vue-cli 4.x 开发环境，好了，资源留下了，我也该下班了。