Vue源码解读1—— 定义

Vue 定义

1. entry-runtime-with-compiler.js文件为入口
2. runtime/index：在 Vue 原型上挂载了__patch__、$mount方法
3. core/index：注册全局 api,Vue.prototype 添加$isServer,$ssrContext,FunctionalRenderContext属性
4. instance/index：定义 Vue function
5. initMixin方法定义Vue.prototype._init

Vue.prototype._init = function (options?: Object) {
     
  const vm: Component = this;
  // vm实例上的唯一标志
  // a uid
  vm._uid = uid++;

  // ... 省略部分代码

  // 标志该对象为Vue实例，避免该对象被响应系统观测
  // a flag to avoid this being observed
  vm._isVue = true;
  // 合并options
  // 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); // 初始化渲染 createElement fn
  callHook(vm, "beforeCreate");
  initInjections(vm); // resolve injections before data/props
  initState(vm); // 初始化 data、props、computed、watcher等
  initProvide(vm); // resolve provide after data/props
  callHook(vm, "created");
  // 检测到如果有 el 属性，则调用 vm.$mount 方法挂载 vm，挂载的目标就是把模板渲染成最终的 DOM
  if (vm.$options.el) {
     
    vm.$mount(vm.$options.el);
  }
};