安装Vue CLI框架 搭建Vue项目

一、安装Node.js
访问官网 https://nodejs.org/en/，首页即可下载。安装原因：npm集中于Node.js中，所以用npm（你怕吗）安装Vue Cli，首先应安装Node.js。

安装步骤：下载完成后运行安装，默认下一步即可。

二、检查Node.js是否安装成功

cmd 中输入：node -v

如上图，出现版本号，说明已经安装成功。同时，npm 包也已经安装成功，可以输入 npm -v 查看版本号
三、npm 更新至最新版本

cmd 输入 npm -g install npm 

四、安装 cnpm，即 npm 国内镜像
原因：使用 cnmp 下载内容会比较快，但下载的包可能不是最新的（这个可以忽略）。

安装 cnpm 的命令为 ：npm install -g cnpm --registry=https://registry.npm.taobao.org

脚下留心：
cnpm 不要与 npm 混合使用，一个项目用 cnpm 就从头用到底，否则就会出现混乱。不过万一遇到这种情况也不用慌，把项目的 node_modules 文件夹删了重新执行 npm/cnpm install 就行了，只是比较浪费时间。

五、安装vue cli

cmd命令（vue2.x）：npm install -g vue-cli 
cmd命令（vue3.x）：npm install -g @vue/cli 

六、搭建Vue项目

 1. win+R进入cmd：
 2. cd 进入相应文件目录
 3. 命令：vue init webpack test-vue  //webpack为项目模板,可替换为pwa、simple 等,项目名称test-vue 

C:\Users\user>E:
E:\>cd test_vue
E:\test_vue>vue init webpack test_vue

? Project name test_vue
? Project description A Vue.js project
? Author
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? No
? Set up unit tests No
? Setup e2e tests with Nightwatch? No
? Should we run `npm install` for you after the project has been created? (recommended) npm

   vue-cli · Generated "test_vue".

vue-router，一定要选是，也就是回车或按 Y，vue-router 是我们构建单页面应用的关键。
接下来等待项目构建完成就 OK 了。