Vue脚手架搭建

安装Node.js

想要安装Vue的脚手架，需要安装Node.js，使用npm，如果没有安装Node.js，请先安装Node.js：到官网（https://nodejs.org/en/）下载安装程序，安装成功后打开cmd输入 npm -v 如果显示npm的版本号，则说明安装成功。

检测npm版本号

如果想要npm最新版本可以输入 npm -install npm -g 进行安装。
如果提示 “npm不是内部或外部命令，也不是可运行的程序或批处理文件。”就打开环境变量，看看有没有把node.js添加到环境变量中，如果没有，就把自己安装Node.js的路径添加到系统环境变量的path中。

NodeJs环境变量

yarn安装

输入 npm install yarn -g 安装yarn

安装Vue脚手架--Vue CLI

npm install @vue/cli -g
# OR
yarn global add @vue/cli -g
# -g ：表示全局

安装后在cmd中输入 vue -V 查看vue/cli（脚手架）是否安装成功，如果安装成功，会显示你安装的版本号。

检测脚手架是否安装成功

如果提示 “vue不是内部或外部命令，也不是可运行的程序或批处理文件。”，可以把vue.exe所在的路径C:\Users\Administrator\AppData\Local\Yarn\bin（我是用yarn安装的脚手架，AppData后面的路径如果没有更改过电脑的路径配置，默认就是这样）添加到系统环境变量的path中。

环境变量设置

再次测试，就可以解决上面的问题啦。

通过脚手架创建Vue项目

打开要创建项目的位置，输入 vue create 项目名 进行创建项目。

vue create vue-demo

选择Vue版本

这里会让你选择Vue的版本，一般来说，我们会选择最后一项——自定义。

选择项目需要的东西（空格选中/取消选中）

以上选项的含义：
-- Choose Vue version：选择Vue的版本；
-- Babel：转码器，可以将ES6代码转为ES5代码，从而在现有环境执行；
-- TypeScript：TypeScript是一个JavaScript（后缀.js）的超集（后缀.ts）包含并扩展了 JavaScript 的语法，需要被编译输出为 JavaScript在浏览器运行；
-- Progressive Web App (PWA) Support ：渐进式Web应用程序；
-- Router ：vue-router（vue路由 https://router.vuejs.org/zh/）；
-- Vuex ：vue的状态管理模式（https://vuex.vuejs.org/zh/）；
-- CSS Pre-processors ：CSS 预处理器（如：less、sass）；
-- Linter / Formatter ：代码风格检查和格式化（如：ESlint）；
-- E2E Testing ：e2e（end to end 端到端）测试。

ps：端到端测试：end to end测试，又称为e2e测试，可以看做一个自动化的测试脚本，其目的是模拟用户行为，通过自动的访问一个真实浏览器环境下的页面，对于页面上的任意操作，断言浏览器中发生特定的行为。

选择Vue版本

剩下的依次选择需要的东西即可。

创建完成

输入 npm run serve 或者 yarn serve 打开服务器，具体是什么创建完成时会有。

打开项目文件夹，开启服务器：

服务器已打开

在浏览器地址栏内输入 http://localhost:8080 就可以访问这个Vue项目了。