Vue2.x导读介绍

导言

该篇导读是读完黄毅老师的Vue技术揭秘之后的自己的理解，大致方向与黄老师一致，其中会加入自己的一些理解以及一些细节的详细介绍，通过这篇文章主要是为了巩固自己的Vue源码知识体系，也是为了总结自己一个多月以来的所有学习到的知识！

Vue2.x的学习方式

希望大家都是对于Vue官方文档比较熟悉后再来考虑阅读源码，不然可能会云里雾里 🙈

源码解读方式

其实每个人学习源码的方式是不同的，我在学习Vue2.x的时候会直接通过Vue导出的文件去学习（当然这个是根据黄毅老师所说的代码才能去找到，这个是方法是基于前人已有详细文档总结才可以实施的方案）

Vue3.x的学习方式

在学习Vue3.x的时候，由于现有的文档零碎，无法系统性的学习，这就会导致我学了前面的忘记后面的，这就要考验我们接触到一个最新源码时需要从哪些方面去入手

  1. 根据官方文档首先整体流程跑一遍
  2. 翻阅网上文档，先对整个源码的核心点有个大概的了解
  3. 查找源码中的package.json看下入口文件
  4. 根据Vue2.x的经验去对应查找一些类似的模块
  5. 抓住核心原理首先去研究，例如reactive数据响应
     在深入代码层面时我们往往一开始是不知道从何下手，在这里可以细分几个方面
      1. 源码中往往会有jest等单元测试工具，我们不妨从这些文件下手，这样能够快速方便的得知函数的具体作用，例如effect类似于Vue2.x的Watcher用于收集依赖与派发更新时调用
      2. 源码往往也提供了在线预览的功能，例如Vue3.x package.json里命令行script: dev，可生成运行时代码，根据生成前的代码可以查找的一些入口
      ...

温馨提示

本次源码基于的是dist/vue.js(该文件包含了编译时代码)

关注我, 不迷路