Vue源码学习之三：总的框架

这一篇其实非常水，没什么实质性内容，只是把 Vue 源码内部的东西都抽空了，放出一个空的架子出来。

我看的 Vue 代码是基于 2.0.3 的，目前而言的最高版本，直接从 dist 里面抽取的生成完的完整的代码，之所以没用 src 目录下的代码，只是因为 es2015 不熟练，flow 之类的更是从来没接触过。

好吧，下面就直接放代码吧，要说的都在注释里了：

// 环境检测，commonjs、amd 之类的支持情况解析
// 在好几个库的开头都看到完全相同的这段话，难不成是打包软件自动生成的？
(function(global, factory) {
    typeof exports === 'object' && typeof module !== 'undefined'
        ? module.exports = factory()
        : typeof define === 'function' && define.amd
            ? define(factory)
            : (global.Vue = factory());
}(this, (function() {
    'use strict';

    function stateMixin(Vue) {}
    function lifecycleMixin(Vue) {}
    function renderMixin(Vue) {}
    function eventsMixin(Vue) {}
    
    var uid = 0;

    function initMixin(Vue) {
        Vue.prototype._init = function(options) {
            var vm = this;

            vm._uid = uid++;
            vm._isVue = true;
        };
    }
    
    function Vue$3(options) {
        // 原代码中如果不用 new 来初始化构造函数，给出一个警告信息
        // 此处参照 underscore 源码，稍做了修改，不用 new 构造，帮你 new 一个
        if(!(this instanceof Vue$3)) {
            return new Vue$3(options);
        }
        this._init(options);
    }
    // 通过混合继承的方式给 Vue$3 添加各类属性、功能
    // 其实我也不知道啥叫混合继承，js 中的继承的概念实在搞不懂
    // 初始化
    initMixin(Vue$3);
    // 状态
    stateMixin(Vue$3);
    // 事件
    eventsMixin(Vue$3);
    // 生命周期
    lifecycleMixin(Vue$3);
    // 渲染
    renderMixin(Vue$3);

    return Vue$3;
})));