什么是 Vue?
Vue.js 是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和 Vue 生态系统支持的库开发的复杂单页应用。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习，非常容易与其它库或已有项目整合。另一方面，在与相关工具和支持库一起使用时 ，Vue.js 也能完美地驱动复杂的单页应用。
基本环境搭建(NodeJs、NPM)
Windwos 下:https://cdn.npm.taobao.org/dist/node/v12.16.1/node-v12.16.1-x64.msi
安装一路 next。最后弹出 CMD 命令行时一路回车。结束后打开 CMD 或者 PowerShell 输入
node -v
npm -v
# 以上两条都输出了版本信息则可以进行下一步。由于npm默认使用的是国外的源https://registry.npmjs.org/，在国内下载东西会非常慢,所以我们在使用前先将npm的源换成淘宝源。
npm config set registry https://registry.npm.taobao.org
npm config get registry # 如果返回了https://registry.npm.taobao.org则国内源配置成功
Vue 工具安装
安装完成后我们来安装 Vue 的工具
npm install -g vue/cli
npm install -g @vue/cli-init
创建第一个 Vue 项目
Windows 下进入一个文件夹，然后按 Shift+鼠标右键，点击在此打开 Powershell
vue init webpack my-project # 使用webpack模板创建一个vue项目,项目的名字可以自行修改,下面是我的配置
? Project name my-project
? 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? (recom
mended) npm
cd my-project # 进入到项目目录中
我是用的的开发环境是 Webstrom。
Vue 项目目录介绍
build 文件夹，用来存放项目构建脚本
config 中存放项目的一些基本配置信息，最常用的就是端口转发
node_modules 这个目录存放的是项目的所有依赖，即 npm install 命令下载下来的文件
src 这个目录下存放项目的源码，即开发者写的代码放在这里
static 用来存放静态资源
index.html 则是项目的首页，入口页，也是整个项目唯一的 HTML 页面
package.json 中定义了项目的所有依赖，包括开发时依赖和发布时依赖
src 目录下:
assets 目录用来存放某些资源
components 目录用来存放组件（一些可复用，非独立的页面），当然开发者也可以在 components 中直接创建完整页面。
router 目录中，存放了路由的 js 文件
App.vue 是一个 Vue 组件
main.js 是整个项目的入口 js
使用编译器打开刚刚初始化好的项目(我这里用的是 WebStorm)
打开项目后点击 Edit Configuration
Command: run
Script: -dev