Skip to content

手把手带你构建自己的 Vue3,只有手写一遍,才能真正的掌握源码!!!实现 Vue3 中的核心三大模块:reactivity 响应式、runtime 运行时、compiler 编译

Notifications You must be signed in to change notification settings

cloudhao1999/guide-mini-vue

Repository files navigation

mini-vue 介绍

手把手带你构建自己的 Vue3,只有手写一遍,才能真正的掌握源码!!!实现 Vue3 中的核心三大模块:reactivity 响应式、runtime 运行时、compiler 编译

当前进度

  • 01-Vue3 源码结构的介绍

  • 02-reactivity 的核心流程

  • 03-runtime-core 初始化的核心流程

  • 04-runtime-core 更新的核心流程

  • 05-setup 环境:集成 jest & ts

  • 06-实现 effect & reactive 依赖收集&触发依赖

  • 07-实现 effect 返回 runner

  • 08-实现 effect 的scheduler 功能

  • 09-实现 effect 的 stop 功能

  • 10-实现 readonly 功能

  • 11-实现 isReactive 和 isReadonly

  • 12-优化 stop 功能

  • 13-实现 reactive 和 readonly 嵌套对象转换功能

  • 14-实现 shallowReadonly 功能

  • 15-实现 isProxy 功能

  • 16-实现 ref 功能

  • 17-实现 isRef 和 unRef 功能

  • 18-实现 proxyRefs 功能

  • 19-实现 computed 计算属性

  • 20-实现初始化 component 主流程

  • 21-使用 rollup 打包库

  • 22-实现初始化 element 主流程

  • 23-实现组件代理对象

  • 24-实现 shapeFlags

  • 25-实现注册事件功能

  • 26-实现组件 props 功能

  • 27-实现组件 emit 功能

  • 28-实现组件 slots 功能

  • 29-实现 Fragment 和 Text 类型节点

  • 30-实现 getCurrentInstance

  • 31-实现provide-inject 功能

  • 32-实现自定义渲染器 custom renderer

  • 33-更新element流程搭建

  • 34-更新element 的 props

  • 35-更新 element 的 children

  • 36-更新 element 的 children - 双端对比diff 算法 (1)

  • 37-更新 element 的 children - 双端对比diff 算法 (2)

  • 38-更新 element 的 children - 双端对比diff 算法 (3)

  • 39-学习尤大解决bug的处理方式

  • 40-实现组件更新功能

  • 41-实现 nextTick 功能

  • 42-编译模块概述

  • 43-实现解析插值功能

  • 44-实现解析 element

  • 45-实现解析 text 功能

  • 46-实现解析三种联合类型

  • 47-parse 的实现原理

  • 48-实现 transform 功能

  • 49-实现代码生成 string 类型

  • 50-实现代码生成插值类型

  • 51-实现代码生成三种联合类型

  • 52-实现编译 template 成 render 函数

  • 53-实现 monorepo

  • 54-实现 watchEffect

课程地址

Vue3 源码实战课 (cuixueshe.com)

About

手把手带你构建自己的 Vue3,只有手写一遍,才能真正的掌握源码!!!实现 Vue3 中的核心三大模块:reactivity 响应式、runtime 运行时、compiler 编译

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published