一张思惟导图辅助你深刻了解 Vue | Vue-Router | Vuex 源码架构

1.前言

本文内容讲解的内容：一张思惟导图辅助你深刻了解 Vue | Vue-Router | Vuex 源码架构。vue

项目地址：https://github.com/biaochenxuying/vue-family-mindmapjava

文章的图文结合版node

Vue-family.mdreact

Vue-family.pdfgit

2. Vue 全家桶

先来张 Vue 全家桶 总图：github

3. Vue

细分以下微信

源码目录

源码构建，基于 Rollup 

Vue 本质：构造函数

数据驱动

组件化

深刻响应式原理

编译

扩展

4. Vue-Router

introduction

路由注册

VueRouter 对象

matcher

路径切换

5. Vuex

introduction

Vuex 初始化

API

插件

6. 已完成与待完成

已完成：markdown

• 思惟导图

待完成：架构

• 继续完善 思惟导图
• 添加 流程图

由于该项目都是业余时间作的，笔者能力与时间也有限，不少细节尚未完善。函数

若是你是大神，或者对 vue 源码有更好的看法，欢迎提交 issue ，你们一块儿交流学习，一块儿打造一个像样的 讲解 Vue 全家桶源码架构 的开源项目。

7. 总结

以上内容是笔者最近学习 Vue 源码时的收获与所作的笔记，本文内容大可能是开源项目 Vue.js 技术揭秘 的内容，只不过是以思惟导图的形式来展示，内容有省略，还加入了笔者的一点理解。

笔者之因此采用思惟导图的形式来记录所学内容，是由于思惟导图更能反映知识体系与结构，更能令人造成完整的知识架构，知识一旦造成一个体系，就会容易理解和不易忘记。

注意：文章的图片可能上传时会通过压缩，可能有点模糊，不过本文用到的 全部 超清图片 都已经放在 github 上，并且还有 pdf 格式、markdown 语法、思惟导图 的原文件，本身能够根据 思惟导图原文件 导出相应的超清图片。

笔者文章常更地址：

1. 微信公众号
2. github
3. 全栈修炼

8. 最后

传承至善

若是你以为本文章或者项目对你有启发，请给个赞或者 star 吧，点赞是一种美德，谢谢。

参考开源项目：

1. https://github.com/ustbhuangyi/vue-analysis
2. https://github.com/HcySunYang/vue-design

关注公众号并回复 福利 可领取免费学习资料，福利详情请猛戳： Python、Java、Linux、Go、node、vue、react、javaScript