前端技术：vue（基本使用+安装chrome vue插件）

一、 中文官网: https://cn.vuejs.org/
二、1.创建普通的html页面，js引入vue.js
2.模板语法声明式的编写一个hello vue

<h1>vue基本使用-hello vue</h1>
<div id="app">
    <div>{{message}}</div>
    <input type="text" v-model="message">
</div>
	<!-- 引入vue.js-->
   <script type="text/javascript" src="js/vue.js"></script>
   <script type="text/javascript">
   		<!--创建vue实例->
        new Vue({
            el:'#app',
            data: {
            message:'hello vue.'
            }
        });
</script>

注释：其中v-model是一个指令，限制在input、select、textarea、components中使用，修饰符.lazy(取代 input 监听 change 事件)、.number(输入字符串转为有效的数字)、.trim(输入首尾空格过滤)。它其实是一个语法糖。

三、chrome浏览器安装vue插件
1、下载chrome扩展插件
在github上下载压缩包并解压到本地，github下载地址：https://github.com/vuejs/vue-devtools
2、npm install
2.1 下载完成后解压文件进入vue-devtools-dev，cmd执行npm install 安装依赖包

2.2 安装完毕后执行 npm run build

2.3 npm run build 执行完毕，会在shells>chrome下的src文件夹里产生如下个js文件；

2.4 打开shells>chrome>manifest.json并把json文件里的"persistent":false改成true

2.5 .打开chrome浏览器，打开更多工具>扩展程序，再点击加载已解压的扩展程序，然后把shells>chrome文件夹放入


2.6 测试安装是否成功
webstorm中使用chrome打开上述代码。查看vue插件安装并运行

四、理解vue中的mvvm(Model-View-ViewModel)