vue.js是一个轻量的mvvm框架，他吸收了react的组件化管理概念，实现数据和展现的分离。吸收angla的界面展现操作方法。
什么是组件化呢？
就是项目的每一个页面都相当于一个组件。后缀名是*.vue,里面有三个组成部分，分别是template、script、style。页面上的数据 展现和js里面的数据值进行双向绑定。template里面的数据改变，js里面也跟着变动。js里面的变动，也会体现在调用js里面数据的template里面。
如何界面展现？
类似于模板引擎的展现标签。以往我们是使用后端返回页面，前端就可以调用后端传过来的属性值，利用模板引擎的特殊标签来进行界面的渲染。现在我们不用后端返回界面，就可以利用标签进行界面的渲染。
搭建环境
1首先安装nodejs环境
http://cdn.npm.taobao.org/dist/node/可以到这个里面下载最新的node。我这里下载的是node-v10.3.0-x64.msi，然后点击进行安装，注意记住自己的安装路径。
2 安装npm
然后在自己的安装路径的目录下新建两个文件夹，node-cache是npm缓存文件夹，一个是全局路径文件夹。以后我们安装的npm包文件都是在node-global里面。输入以下命令。
这个时候我们可以进行测试看node版本号，成功打印就代表安装成功。
3 安装cnpm
因为npm工具是国外的，下载会慢，我们可以安装国内的镜像
然后我们要配置环境变量
在系统变量的Path里面确保下面的变量是配置完整的
这样就可以使用cnpm命令了，在cmd里面测试一下
4 安装vue脚手架
vue提供的命令行工具， 有了vue脚手架，我们可以在控制台使用vue命令，使用vue命令可以创建vue模板，例如webpack等。
在控制台打命令：cnpm install -g vue-cli进行安装
5 创建一个项目
方法一：命令行创建
创建alt+F12打开webstorm的命令行窗口，输入：
vue init webpack my-project
运行项目：npm run dev
方法二：安装webstorm创建vue.js项目。webstorm要安装nodejs插件和vue插件，
vue是怎么生成界面的呢
*.vue是通过webpack打包工具就可以将一个vue文件打包成*.html、*.js、*.css。每个js就相当于一个new了一个vue对象，即new Vue({.......})。页面的数据层全部都在vue对象里面，展现层就是在html里面。
实例化vue对象
new Vue({
data: {
a:1
b:[]
},
method: {
},
watch{
}
})
vue对象需要实例化，实例化就会有许多参数，data用于存储页面中涉及的变量这些，也就是页面所需的数据，就是所谓的model层。method用于存放页面中调用到的方法，watch用于监听，比方说，如果监听了data里面的a，a一旦有增删查改，watch里面的方法就会被调用。
html指令
类似于thymleaf标签，用于html和vue的model层进行交互。