Vue的源码结构比较复杂，使用了很多面向对象的高级技术。覆盖方法、扩展方法、多态等应用。从Vue实例的加载过程可以看出。本节重点介绍Vue的源码加载过程是怎样的。前言Vue目前是国内前端web端世界的三分之一，也是我主要的技术栈之一。我在日常使用中知道它，我很好奇为什么。另外，最近社区涌现出大量的vue源码阅读班。文章。我会借此机会从大家的文章和讨论中吸取一些营养，同时在阅读源码的时候总结一些思路，产出一些文章作为自己思考的总结。预备知识FlowES6语法常用设计模式Curry等函数式编程思想1.Vue介绍及初始化过程Vue的源代码结构如下：A.compiler用于编译a.vue使用字符串作为模板b．在compilation文件夹中存放解析模板字符串，抽象语法树，优化等的算法B.core核心，vue构造器，生命周期的一部分C.platforms平台对于运行环境（设备），有不同的实现b．也是vue的入口D.server服务器，主要在server的处理代码中使用了vue（略）E.sfc，单文件组件（略）F.编译文件夹中存放模板字符串的解析Algorithm,abstract语法树、优化等共享的公共工具、方法二、Vue对象在使用vue的时候，我们知道我们都是通过newVue()将vue的实例挂载到dom对象上，从而使用数据驱动的方式来实现的展开我们的代码，我们先来看一下Vue的定义。从源码上看，core目录下的index.js文件是js中的一个函数。其实Vue就是一个函数。当它初始化时，它会在原型链上执行_init。方法，Vue并没有把所有的方法都写在函数里面，这样在代码上，不会每次实例化都会产生重复的代码。主要原因是代码结构更加清晰。使用mixin的概念，将各个模块分开，使代码的结构和可扩展性大大提高。这里先不说每一个mixin，看一下整体结构，这里定义完之后，在核心会被index.js再次封装，调用initGlobalAPI(Vue)初始化全局API方法。在web下的runtime文件夹下再次引用并打包。Vue分为运行时可编译和只运行版本，所以如果需要编译，在Vue原型中添加$mount方法。3、运行机制当我们在main.js中newVue()时，Vue会调用构造函数的_init()方法，定义在core/instance/index.js的initMixin()方法中，我们可以看一下init()方法的初始化：这里的_init()方法会对当前vm实例进行一系列的初始化设置。比较重要的是初始化state方法initState(vm)进行data/propsResponsiveness，这就是传说中通过Object.defineProperty()方法为需要响应的对象设置getters/setters，并基于此，进行DependencyCollection，达到数据变化驱动视图变化的目的。最后查看vm.$options上是否有el属性，如果有则使用vm.$mount方法挂载vm，形成数据层和视图层的连接。这就是为什么如果不提供el选项则需要手动vm.$mount('#app')的原因。我们看到createdhook是在$mount挂载之前调用的，所以在createdhook被触发之前我们无法操作DOM，因为还没有渲染到DOM。4.总结一张图看全过程
