首先，说一下vue框架是什么？
vue.js是当下主流的一种前端框架，当然了还有Angular、React等框架.
一、渐进式框架Vue
- 什么是渐进式框架。
vue官网说：Vue.js（读音 /vjuː/，类似于 view） 是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。
渐进式我个人理解就是阶梯式向前。vue是轻量级的，它有很多独立的功能或库，我们会根据我们的项目来选用vue的一些功能。就像我们开发项目时如果只用到vue的声明式渲染，我就只用vue的声明渲染，而我们要用他的组件系统，我们可以引用它的组件系统。
vue的渐进式表现为
声明式渲染——组件系统——客户端路由——-大数据状态管理——-构建工具
二、vue两个核心点
1.响应式数据绑定
当数据发生变化是，vue自动更新视图
它的原理是利用了 Object.definedProperty 中的setter/getter 代理数据，监控对数据的操作。（这也是为什么vue不支持ie8 以及更早的ie浏览器的原因）
2.组合的视图组件
ui页面映射为组件书
划分组件可维护、可重用、可测试
三、mvvm模式
M： model （数据层，也就是指数据（前端是js））
V：view ( 也就是指DOM层 或用户界面 )
VM : view-model (处理数据和界面的中间层，也就是指Vue)
四、vue的优点如下:
1.低耦合。视图（View）可以独立于Model变化和修改，一个ViewModel可以绑定到不同的"View"上，当View变化的时候Model可以不变，当Model变化的时候View也可以不变。
2.可重用性。你可以把一些视图逻辑放在一个ViewModel里面，让很多view重用这段视图逻辑。
3.独立开发。开发人员可以专注于业务逻辑和数据的开发（ViewModel），设计人员可以专注于页面设计，使用Expression Blend可以很容易设计界面并生成xml代码。
4.可测试。界面素来是比较难于测试的，而现在测试可以针对ViewModel来写.
接下里我们安装vue环境:
安装node.js
从node官网https://nodejs.org/zh-cn/下载 并安装，一路"next",就完成了，下载长期维护版本的。
安装完成后，快捷键ctrl+r，输入cmd进入命令行工具输入命令node -v,，出现如下图，就安装成功了
我们所需要的npm包管理器，是集成在node中的，所以，直接输入npm -v就会如下图所示，显示出npm的版本信息
node的环境已经安装完了,npm包管理工具也有了
安装cnpm(如果用的是npm,这一步忽略，进行下一步安装vue-cli脚手架)
由于npm的有些资源被墙，为了更快更稳定,所以我们需要切换到淘宝的npm镜像——cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
要用到npm的地方直接使用cnpm替换就可以了
安装vue-cli脚手架构建工具
vue-cli 提供一个官方命令行工具，可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置，带来现代化的前端开发流程。只需几分钟即可创建并启动一个带热重载、保存时静态检查以及可用于生产环境的构建配置的项目：
全局安装 npm install --global vue-cli //加global 安装到全局
全局安装 npm install --global vue-cli也可以这样写npm install --g vue-cli(简写)
创建一个基于 webpack 模板的新项目
要创建项目，首先我们要选定目录，然后再命令行中把目录转到选定的目录,初始化一个项目
vue init webpack vue-demo == vue init webpack-simple vue-demo //vue-demo自定义项目名
运行初始化命令的时候回让用户输入几个基本的选项，如项目名称，描述，作者等信息，如果不想填直接回车默认就好
如下图:
需要注意的是项目的名称不能大写，不然会报错。
Project name (my-project) # 项目名称（我的项目）
Project description (A Vue.js project) # 项目描述一个Vue.js 项目
Author 作者（你的名字）
Install vue-router? (Y/n) # 是否安装Vue路由，也就是以后是spa（但页面应用需要的模块）
Use ESLint to lint your code? (Y/n) # 使用 ESLint 到你的代码？ （Y [ yes ] / N [ no ]）
Pick an ESLint preset (Use arrow keys) # 选择一个预置ESLint（使用箭头键）
Setup unit tests with Karma + Mocha? (Y/n) # 设置单元测Karma + Mocha？ （Y/ N）
Setup e2e tests with Nightwatch? (Y/n) # 设置端到端测试，Nightwatch？ （Y/ N）
当然这些都看你自己个人的情况，我这里是全选了是
项目目录如下图:
按照提示 To get started:
cd vue
npm install //安装项目所需要的依赖
npm run dev //运行项目
刚初始化的项目是没有依赖的，如果 启动项目会报类似这样的错误
解决项目的依赖问题，使用下面的命令安装项目的依赖
npm install
cnpm install（前提是安装了淘宝镜像 npm install -g cnpm --registry=https://registry.npm.tabobao.org）
如果出现如下图情况，说明依赖解决成功。
运行项目
npm run dev
或
cnpm run dev（前提是安装了淘宝镜像 npm install -g cnpm --registry=https://registry.npm.tabobao.org）
看到这个界面，说明就配置成功了