目录
dist： （ 发布目录 ）
flow： （ 针对flow的类型申明 ）
examples （ 范例 ）
packages （ 核心代码之外的独立库 ）
scripts （ 构建脚本 ）
src （ 源码 ）
compiler （编译器相关）
core (核心代码，你想要的 我都有)
- components： 通用组件keep-alive
- global-api 全局Api
- instance 构造函数等
- observe 响应式相关
- util 工具函数
- vdom 虚拟DOMtest （ ts类型声明 ）
1、src\platforms\web\entry-runtime-with-compiler.js
入口文件，覆盖$mount，执行模板解析和编译工作
2、src\platforms\web\runtime\index.js
定义$mount
3、src\core\index.js
定义全局Api src\global-api\index
initUse(Vue)
initMixin(Vue)
initExtend(Vue)
initAssetRegisters(Vue)
4、src\core\instance\index.js
Vue构造函数
// 初始化， 通过initMixin混入给Vue添加_init方法
this._init(options)
initMixin(Vue) // 通过该方法给vue添加_init方法
stateMixin(Vue) // $set $delete $watch
eventsMixin(Vue) // 和事件相关 $emit $on $once $off
lifecycleMixin(Vue) // 生命周期
renderMixin(Vue) // render函数
5、src\core\instance\init.js
Vue初始化核心文件
创建组件顺序：自上而下
执行挂载顺序：自下而上
initLifecycle(vm) // 生命周期相关变量的初始化
initEvents(vm) // 对父组件传入的事件添加监听
initRender(vm) // 声明$slot $createElement
callHook(vm, ‘beforeCreate’) // 调用钩子函数
initInjections(vm) // 注入数据
initState(vm) // 重要：数据初始化
initProvide(vm) // 数据提供
callHook(vm, ‘created’) // 生命周期函数
5、src\core\instance\state.js
initData： 获取Data，设置代理，启动响应式observe
6、src\core\observe\index.js
设置响应式数据
7、动态参数
#v-bind 缩写<!-- 完整语法 --><a v-bind:href="url"> ... </a><!-- 缩写 --><a :href="url"> ... </a><!-- 动态参数的缩写 --><a :[key]="url"> ... </a>#v-on 缩写<!-- 完整语法 --><a v-on:click="doSomething"> ... </a><!-- 缩写 --><a @click="doSomething"> ... </a><!-- 动态参数的缩写 (2.6.0+) --><a @[event]="doSomething"> ... </a>
8、条件渲染
在 <template> 元素上使用 v-if 条件渲染分组<template v-if="ok"> <h1>Title</h1> <p>Paragraph 1</p> <p>Paragraph 2</p></template>v-show 不支持 <template> 元素，也不支持 v-else。 一般来说，v-if 有更高的切换开销，而 v-show 有更高的初始渲染开销。因此，如果需要非常频繁地切换，则使用 v-show 较好；如果在运行时条件很少改变，则使用 v-if 较好。
9、列表渲染
在 <template> 中使用 v-for
类似于 v-if，你也可以利用带有 v-for 的 <template> 来循环渲染一段包含多个元素的内容。比如：<ul>
<template v-for="item in items">
<li>{{ item.msg }}</li>
<li class="divider" role="presentation"></li>
</template></ul>10、事件处理
事件处理程序中可以有多个方法，这些方法由逗号运算符分隔：<!-- 这两个 one() 和 two() 将执行按钮点击事件 --><button @click="one($event), two($event)">
Submit</button>methods: {
one(event) {
// first handler logic...
},
two(event) {
// second handler logic...
}
}11、表单输入
<!-- .number -->如果想自动将用户的输入值转为数值类型，可以给 v-model 添加 number 修饰符：<input v-model.number="age" type="number" />这通常很有用，因为即使在 type="number" 时，HTML 输入元素的值也总会返回字符串。如果这个值无法被 parseFloat() 解析，则会返回原始的值。<!-- .trim -->如果要自动过滤用户输入的首尾空白字符，可以给 v-model 添加 trim 修饰符：<input v-model.trim="msg" />
