vue3源码分析

本期主要实现了如何将ast生成代码,在生成代码的过程，需要使用transform来转换代码，里面可以使用插件系统来对某个节点的个性化操作。在codegen模块中，创建上下文，来逐步增加对于的字符串。

本期主要实现了vue3中的complier的核心，是如何`<div>hi, twinkle, {{message}}</div>`这里字符串的。**vue3是采用逐步推进的方式，解析完一段就删除一段，

本期主要实现了`nextTick()`，通过`nextTick`看到了`vue`更新`dom`的方式是异步的。并且在这种方式的基础之上，需要使用到**js的事件循环**，在事件循环中**微任务比宏任务

在组件更新中,主要的流程是 `updateComponent--> updateComponentPreRender --> render`, 在这三个函数中交换新老vnode的属性,给把当前的vno

1. 老的比新的**左边长**，在新的左边创删除的节点 2. 老的比新的**右边长**，在新的右边创删除的节点 3. 老的比新大**左边短**,在新的左边创建新的节点 4. 老的比新的**右边短**，

vue3元素更新的流程， vue3的属性更新（3种情况），vue3的children更新（4种情况）两者都存在，执行修改；老的存在，新的不存在，执行删除；老的被设置成null或者undefined也需

本期主要实现了`createRenderer函数`，`改造createApp`等函数，通过这些函数，可以看到vu3在设计方面的用心良苦，尽量让vue3满足更多的人。增加了`runtime-test`，

`getCurrentInstance,provide,inject`的实现，在`getCurrentInstance`中只是用了一个中间变量，而`provide`是把数据存在当前的`instance

引言 <<往期回顾>> vue3源码分析——rollup打包monorepo vue3源码分析——实现组件的挂载流程 vue3源码分析——实现props,emit，事件处理等 本期来实现， slot—

引言 <<往期回顾>> vue3源码分析——rollup打包monorepo vue3源码分析——实现组件的挂载流程 本期来实现，setup里面使用props,父子组件通信props和emit等，所有

思考再三，先把这一节先说了，**jest是怎么来测试dom的？这里详细介绍了vue3组件的初始化流程，这里主要是实现挂载

monorepo是多个单体仓库合并得到的，那么咋们就先来**打包单个仓库**，然后再来想办法怎么**一键打包全部**

手动实现，ref, isref, unref, computed, proxyRefs的实现方式

手写vue3源码——readonly, isReactive,isReadonly, shallowReadonly

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第5天，点击查 reactive, effect 大家都清除 ,但是对于scheduler, stop等方法是需要看源码咋们才能明白

，点击查 引言 在前面的文章中，分析了vue3的响应式数据原理、vue组件初始化流程、vue组件更新流程等文章，有人说学习源码, 用pnpm + monorepo的方式来创建一个自己的源码库

先写一个组件，App.js, 然后咋们来执行更新的流程 mount update 还记得组件挂载阶段中的 setupRenderEffect么？ 在这里的时候会进行依赖收集，会在实例instance上

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第2天，点击查看活动详情 既然是看vue组件的初始化流程，咋们先来创建基本的代码，跑跑流程 （在app.vue中写入以下内容，来跑流

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第1天，点击查看活动详情 在vue源码中的renderer.ts 中有这么这么个代码片段 reactive reactive 是用于