vue作为一个流行的前端框架，我们该如何将其应用到工作中呢？简单概括为以下三步：
（1）安装vue
我们采用npm的方式安装。因此，在使用npm之前先将安装npm。nodeJS中包含npm，所以我们此前直接安装nodeJS

npm install vue

（2） 引入vue

<script type='text/javascript' src='node_modules/vue/dist/vue.js'></script>

（3）基本使用

let vm =  new Vue({
   //el通过指定id来绑定页面中的dom元素
  el:'#app'
   // 数据属性data可以是对象形式也可以是函数形式，一般采用函数形式。用数据来驱动视图，在视图层使用的格式为{{数据属性名}}
  data:function() {
       msg:'加油哦',
  	   isTrue: 1==1,
  	   str:'hello vue'
  },
  // 注入局部组件，只有注入了才能使用，假设App是我们已经定义好的局部组件
  components:{
       App
  },
  // 使用局部组件，要避免才坑点的是 template中包含的内容不是用引号包含，而是用`...`。而且一旦template中存在内容则会覆盖掉id='app'的div中编写的内容
  template:`
		<App/>
 `,
 //定义函数
 methods:{
    changeHandler:function() {
    }
 },
 //侦听数据属性
 watch:{
  	msg:function(newV,oldV) {
  	}
},
//定义过滤器
 filters:{
    //该过滤器的作用是给数据添加美元符$
    addOtherToNum: function(value) {
  			return  '$' + value
    }
  }
})
//暴露出vm下的属性和方法
console.log(vm)
//调用vm对象下的属性和方法时需添加$，而data下具体的数据则无需
console.log(vm.$el)
console.log(vm.$data)
console.log(vm.msg)  

代码中的四个控制台输出对应的结果分别为：