vue的入口在哪里

我们在new vue的时候 首先进入 src/core/instance下的index.js文件
这个文件种有一个导出的方法 Vue
  这个方法先对vue进行判断，判断当前的指针，是不是Vue类型的
  如果不是，就弹出一个警告 ，之后调用this._init真正的初始化函数
  这个_init函数是在 initMixin这个函数内部的方法最终，被加在vue的原型上
  初始化函数也在内部

Vue源码 src/core/instance/index.js

function Vue(options) {
    if (process.env.NODE_ENV !== 'production' &&
        !(this instanceof Vue)
    ) {
        warn('Vue is a constructor and should be called with the `new` keyword')
    }
    this._init(options)
}
//这些mixin，就是向vue的原型上挂载方法
//将代码按照功能拆分，分别管理不同的功能的原型，方便维护
initMixin(Vue)

_init函数做了什么

这个函数主要是做初始化工作
  1.生成uid
  2.将传入的option最终赋值给vm.$options上，我们可以通过$options访问到el，通过$options.data获取data
  3.初始化一些必要的内容 ，比如生命周期，事件中心，render渲染，hook，injections，state，provied 
  4.初始化完成之后判断el有没有el，如果有就通过vm.$mount做挂载（挂载为真正的dom对象）
  5.执行完第四步，页面上就出现了内容
vm.$mount方法十分重要

_init函数

  Vue.prototype._init = function (options?: Object) {
    const vm: Component = this
    // a uid
    vm._uid = uid++

    let startTag, endTag
    /* istanbul ignore if */
    if (process.env.NODE_ENV !== 'production' && config.performance && mark) {
      startTag = `vue-perf-start:${vm._uid}`
      endTag = `vue-perf-end:${vm._uid}`
      mark(startTag)
    }

    // a flag to avoid this being observed
    vm._isVue = true
    // merge options
    if (options && options._isComponent) {
      // optimize internal component instantiation
      // since dynamic options merging is pretty slow, and none of the
      // internal component options needs special treatment.
      initInternalComponent(vm, options)
    } else {
      vm.$options = mergeOptions(
        resolveConstructorOptions(vm.constructor),
        options || {},
        vm
      )
    }
    /* istanbul ignore else */
    if (process.env.NODE_ENV !== 'production') {
      initProxy(vm)
    } else {
      vm._renderProxy = vm
    }
    // expose real self
    vm._self = vm
    initLifecycle(vm)
    initEvents(vm)
    initRender(vm)
    callHook(vm, 'beforeCreate')
    initInjections(vm) // resolve injections before data/props
    initState(vm)//初始化状态
    initProvide(vm) // resolve provide after data/props
    callHook(vm, 'created')

    /* istanbul ignore if */
    if (process.env.NODE_ENV !== 'production' && config.performance && mark) {
      vm._name = formatComponentName(vm, false)
      mark(endTag)
      measure(`vue ${vm._name} init`, startTag, endTag)
    }

    if (vm.$options.el) {
      vm.$mount(vm.$options.el)
    }
  }
}

/--------------------------------------------------------------------------------------/

初始化数据---实现数据监听

initstate函数---在_init中被调用

这个函数是在_init中调用，用于初始化数据的
这些数据就是我们new vue时传入的对象参数
判断vm.$options中有没有props属性，就初始化props
判断vm.$options中有没有methods属性，有就初始化methods
判断vm.$options中有没有data属性，有就初始化data，否则将data赋值为空对象
判断vm.$options中有没有copmouted属性，有就初始化computed
判断vm.$options中有没有watch属性，而且这个属性不等于nativeWatch，就初始化watch

initstate源码

export function initState (vm: Component) {
  vm._watchers = []
  const opts = vm.$options//指针转存
  //初始化options的各种数据
  if (opts.props) initProps(vm, opts.props)
  if (opts.methods) initMethods(vm, opts.methods)
  if (opts.data) {
    initData(vm)
  } else {
    observe(vm._data = {}, true /* asRootData */)
  }
  if (opts.computed) initComputed(vm, opts.computed)
  if (opts.watch && opts.watch !== nativeWatch) {
    initWatch(vm, opts.watch)
  }
}

initData函数---instate函数中调用

  1.将data对象获取
  2.判断data是不是function 
    如果是，就getData
    如果不是，就获取data
   最后将获取到的data传给data和vm._data
  3.判断data是不是对象，在开发环境下，会报一个警告 必须返回一个对象
  4.获取data的key，和vm.$options.props,和vm.$options.methods，然后循环对比props和methods中的key
是不是与data中的key重名，比如在data上定义了message，在props下也定义了message，会产生冲突，因为这些属性都会挂在到vm这个实例上
通过proxy对data属性做一个代理，这是实现响应式的关键部分，使用了Object.defineProperty函数，完成的
getter，setter监听

initData函数源码

function initData (vm: Component) {
  let data = vm.$options.data
  data = vm._data = typeof data === 'function'
    ? getData(data, vm)
    : data || {}
  if (!isPlainObject(data)) {
    data = {}
    process.env.NODE_ENV !== 'production' && warn(
      'data functions should return an object:\n' +
      'https://vuejs.org/v2/guide/components.html#data-Must-Be-a-Function',
      vm
    )
  }
  // 获取props和methods对象，和data的key，循环比较，判断对象中是否有与data重复的名称
  const keys = Object.keys(data)
  const props = vm.$options.props
  const methods = vm.$options.methods
  let i = keys.length
  while (i--) {
    const key = keys[i]
    if (process.env.NODE_ENV !== 'production') {
      if (methods && hasOwn(methods, key)) {
        warn(
          `Method "${key}" has already been defined as a data property.`,
          vm
        )
      }
    }
    if (props && hasOwn(props, key)) {
      process.env.NODE_ENV !== 'production' && warn(
        `The data property "${key}" is already declared as a prop. ` +
        `Use prop default value instead.`,
        vm
      )
    } else if (!isReserved(key)) {
      //通过这个函数实现数据的监听
      proxy(vm, `_data`, key)
    }
  }
  // observe data
  observe(data, true /* asRootData */)
}

getData函数---将data数据传给vm对象

export function getData (data: Function, vm: Component): any {
  // #7573 disable dep collection when invoking data getters
  pushTarget()
  try {
    return data.call(vm, vm)
  } catch (e) {
    handleError(e, vm, `data()`)
    return {}
  } finally {
    popTarget()
  }
}

proxy函数

这个函数实现了数据的监听，这个函数是对Object.defineProperty的封装

proxy函数源码

 //定义了对象的监听模板
const sharedPropertyDefinition = {
  enumerable: true,
  configurable: true,
  get: noop,
  set: noop
}
//函数 参数  vm对象，_data 数据的对象，key
export function proxy (target: Object, sourceKey: string, key: string) {
  //设置getter方法
  sharedPropertyDefinition.get = function proxyGetter () {
    return this[sourceKey][key]
  }
  //设置setter方法
  sharedPropertyDefinition.set = function proxySetter (val) {
    this[sourceKey][key] = val
  }
  //通过原生函数实现监听
  Object.defineProperty(target, key, sharedPropertyDefinition)
}