vuesrccompiler（编译相关）codegenevent.js(解析事件，keycode、event)index

src
compiler（编译相关）
codegen
event.js(解析事件，keycode、event)
index.js(解析)
directives
bind.js(给v-bind的el元素添加wrapData函数)
index.js(导出on, bind, cloak)
model.js(解析v-model)
on.js(给v-on的el元素添加wrapListeners函数)
parser(template解析ast语法树)
entity-decoder.js
filter-parser.js
html-parser.js(解析html)
index.js
text-parser.js
codeframe.js
create-compiler.js（创建complier）
error-detector.js（检测关键字与语法错误）
helpers.js
index.js
optimizer.js（优化检测静态树，不需要更新的dom）
to-function.js
core（核心代码）
components
index.js
keep-alive.js（缓存组件实例）
global-api
assets.js（资产注册方法）
extend.js（vue.extend）
index.js
mixin.js（merge mixin与options）
use.js(vue插件)
instance
render-helpers
bind-dynamic-keys.js（绑定动态的key）
bind-object-listeners.js（v-on）
bind-object-props.js（v-bind sync）
check-keycodes.js（）
index.js（将renderhelper转义_o _n...）
render-list.js（v-for的解析）
render-slot.js（slot的解析）
render-static.js（编译静态dom树）
resolve-filter.js
resolve-scoped-slots.js
resolve-slots.js
events.js（once、off、on、emit）
index.js（new Vue入口）
init.js
inject.js
lifecye.js（$mount,）
proxy.js（开发环境下）
render.js（初始化render，挂载）
state.js（判断data是不是函数，以及校验props与method的key值，访问this的属性时，proxy做了一层代理，实际访问的是vm._data）
oberver
array.js
dep.js
index.js
scheduler.js
tranverse.js
watcher.js（isRenderWatcher是否是渲染watcher）
util
debug.js
env.js
error.js
index.js
lang.js
next-tick.js
options.js
props.js
vdom
helper
extract-props.js
get-first-component-child.js
index.js
is-async-placeholder.js
merge-hook.js
normalize-children.js
normalize-scoped-slots.js
resolve-async-component.js
update-listeners.js
modules
...
create-component.js
create-element.js
create-functional.-component.js
patch.js（将vnode patch成真实的dom利用函数柯里化将平台差异抹平，先插入子节点再将整个节点挂载到el上）new Vue -> init-> $mount -> compile->render-> vnode->patch->dom
vnode.js
config.js
index.js
plaforms（不同平台的支持）
server（服务端渲染）
sfc（.vue文件解析）
shared（共享代码）

vue核心思想-数据驱动

$mount都做了那些事情：最终编译模版render函数，runtime only，watcher观察者模式

渲染watcher与普通watcher区别

响应式数据的理解 总结：vue响应式原理核心是，数据劫持，利用object.defineproperty的getter和setter方法，todo：引申到vue中的响应式
数据驱动的理解
vue核心思想就是数据驱动，所谓数据驱动是指由视图是由数据驱动生成的，我们对视图的修改，不会直接操作dom，而是通过修改数据，它相比传统的前端开发，简化了代码量，只需要关心数据的修改会让代码的逻辑变得非常清晰，因为dom是数据的映射，所有的逻辑都是对数据的修改，不用操作dom，使代码利于维护。
vue如何检测数组变化
使用函数劫持的方式，重写了数组的方法；
vue将data中的数组进行了原型链的重写，指向了自己定义的数组原型方法；
new Vue做了那些事情
主要将配置合并，初始化生命周期，初始化事件中心，初始化渲染，初始化data、props、computed、watcher等。
Virtual Dom是什么
利用原生的js去描述一个dom，借助开源的snabbdom的实现。
Vue生命周期
beforeCreate和created，是在实例化vue init阶段，调用initState函数前后，initState的作用是初始化props、data、methods、watch、computed等属性，
```
callHook(vm, 'beforeCreate')
initInjections(vm) // resolve injections before data/props
initState(vm)
initProvide(vm) // resolve provide after data/props
callHook(vm, 'created')
```
所以beforeCreate获取不到props、data的值，不能调用method，这两个钩子不能访问dom，可以用于与后端做数据交互；
beforeMount和mounted，在执行vm._render()函数渲染之前，执行了beforeMount钩子函数，在执行完vm._update() 把VNode patch到真实DOM后，执行mounted钩子，mounted钩子的执行顺序是先子后父；
```
export function mountComponent (
  vm: Component,
  el: ?Element,
  hydrating?: boolean
): Component {
  callHook(vm, 'beforeMount')
  updateComponent = () => {
    vm._update(vm._render(), hydrating)
  }
  new Watcher(vm, updateComponent, noop, {
    before () {
      if (vm._isMounted && !vm._isDestroyed) {
        callHook(vm, 'beforeUpdate')
      }
    }
  }, true /* isRenderWatcher */)
  hydrating = false

  if (vm.$vnode == null) {
    vm._isMounted = true
    callHook(vm, 'mounted')
  }
  return vm
}
```
beforeUpdate和updated，beforeUpdate的渲染时机是在Watcher的before函数中，在vm._watcher的回调执行完毕后，才会执行updated钩子函数；
beforeDestroy和destroyed，beforeDestroy在 $destroy函数执行最开始的地方，destroy会执行一系列的包括从parent的$ children中删除自身，删除watcher，当前渲染的VNode执行销毁钩子函数等，执行完毕后再调用destroy钩子，在执行$destroy中会执行vm.patch(vm._vnode,null)触发子组件的销毁钩子函数，层层递归调用，所以destroy的执行顺序是先子后父； activated和deactivated
vue中模板编译原理
生命周期钩子是如何实现的
vue.mixin的使用场景和原理
nextTick在哪里使用，原理是什么
vue为什么需要虚拟dom
vue中的diff原理
vue.set方法是如何实现的
vue的声明周期方法有哪些，一般在哪一步发起请求及原因
vue组件传值的方式及之间的区别
$attr是为了解决什么问题出现的，应用场景有哪些，proviede/inject不能解决它能解决的问题吗
vue的组件渲染流程
vue中组件的data为什么是一个函数
v-if和v-show的区别
vue.use是干什么的，原理是
vue-router有几种钩子函数，具体是什么及执行流程是怎样
vue-router两种模式的区别
函数式组件的优势及原理
v-if与v-for的优先级
组件中写name选项又有哪些好处及作用
vue时间修饰符有哪些，原理是
vue.directive的源码实现
如何理解自定义指令
对vuex的理解
vue中slot是如何实现的，什么时候使用
keep-alive平时在哪里使用，原理是
$refs是如何实现的
vue中使用了哪些设计模式
vue3和vue2的区别，vue3有什么做了哪些改进，vue2缺点是没什么

v-if和v-show的区别

v-if的本质是动态的向DOM树中添加或者删除元素，切换是组件编译与卸载的过程，

v-show是控制标签的display属性显示隐藏