首页 实战 Vue3源码解析，打造自己的Vue3框架，领悟尤大思维精髓
收藏

Vue3源码解析，打造自己的Vue3框架

以轻松的方式解构Vue3源码，掌握高阶编程思维

Vue3源码解析，打造自己的Vue3框架，领悟尤大思维精髓

￥599.00
已完结 难度 高级 时长 31小时 学习人数 402 综合评分 9.57
立即购买 加购物车
立即购买 加购物车
一站式掌握两大框架源码解析
套餐价格：¥1,078.00
2门课 总价：¥1,198.00
立即购买
课程介绍 
高级  · 402人报名 ¥599.00
课程介绍 
高级  · 221人报名 ¥599.00

这不是一个高冷、不接地气的源码课！而是一个从开发者实际工作角度出发，结合 Vue 3 的设计机制，通过产出一个精简版 Vue 3 框架的方式，让大家可以站在 Vue 3 源码设计者的角度，俯视所有业务场景，彻底搞清楚每一行 Vue 代码背后，Vue 都做了什么！课程的核心设计原则：让更多的人，以更轻松的方式，学习Vue 3 源码！

Sunday
讲师

全栈工程师

课程预览

检测到您还没有关注慕课网服务号，无法接收课程更新通知。请扫描二维码即可绑定
重新观看
课程目标

成为一个前端高手的最佳方式就是循迹高手的脚步

从实际工作场景出发，真正掌握Vue3源码，实现技术深度与思维的双重提升！

了解 Vue3源码实现原理
读懂尤大理念精髓
掌握Vue源码设计思想，彻底掌握响
应系统、运行时、编译器三大模块，
由内到外看透Vue
打造专属 Vue3框架
提升技术深度与广度
用最低的门槛实现一个
「 Vue-next-mini 」框架
拓展编程思路
像大神一样思考
提升技术视野，拓展编程思路，
向大神更近一步
课程亮点

以测试用例为驱动，致力于用最少的代码实现逻辑，降低学习难度

· Vue3框架设计 ·
  • · 命令式编程、声明式编程配置
  • · 运行时、编译时
  • · Vue3 源码 TypeScript 配置方案
  • · Vue3 源码调试方案（sourceMap 、 热更新）
  • · Vue3 源码代码标准处理
  • · 模块打包器 rollup
· Reactivity响应性 ·
  • · Vue2 响应性设计及缺陷 · Vue3全新响应性 API（Proxy、Reflect）
  • · 响应性 API （reactive 、 ref） · 调度系统（lazy 、 dirty 、 scheduler）
  • · 计算属性与侦听器（computed 、 watch）
  • · 依赖处理与代理监听（WeakMap 、 Dep 、 track 、 trigger 、 effect）
· Runtime运行时 ·
  • · 虚拟节点树（VNode 、 h 函数）
  • · 渲染器与渲染函数 （Element、Text、comment、Fragment......等 挂载、更新、打补丁）
  • · 属性处理（class 与 style 的增强处理、vei 事件更新、HTML Attributes 、 DOM Properties）
  • · 组件构建（状态组件、生命周期钩子、组件的响应性
  • · composition API
  • · 全新的 diff 算法（最长递增子序列 、 五大场景的详细解析）
· Compiler编辑器 ·
  • · 编辑器处理流程（编译前端、编译后端）
  • · 有限自动状态机
  • · parse（抽象语法树 AST）
  • · transform （JavaScript AST）
  • · generate （目标代码生成）
  • · 深入编辑器（编辑器的响应性、多层级渲染、指令处理）

资料完备，仅几十万字的图文节就堪比Vue3源码书籍的体量

190篇图文节，超40万字，让学习有迹可循

课程大纲
第1章 课程导读
明确课程的核心：这是一个让《初级软件开发工程师都能够学会》同时可以让《高级软件工程师也能收获颇多，更进一步》的源码课
第2章 框架设计前瞻 - 框架设计中的一些基本概念
本章节主要需要介绍框架设计中的基本概念，因为对于很多开发者而言，平时工作中，更多的是针对应用进行开发，对框架本身的设计接触比较少，所以我们需要在一开始的时候，进行一个科普。
第3章 Vue 3源码结构 - 搭建框架雏形
主要讲解Vue 3 源码如何进行 debugger、源码的各个模块是如何进行划分与配合工作的、Vue 3 的代码框架设计有什么独特之处。
第4章 响应系统 - 响应系统的核心设计原则
从 vue 2 到 vue 3，从 Object.defineProperty 到 Proxy 。这样的升级带来了什么样的变化，Object.defineProperty 又存在哪些设计层的缺陷呢？本章统统告诉你
第5章 响应系统 - 初见 reactivity 模块
reactive 函数是响应性的核心函数之一。本章将讲解 reactive 函数是如何构建响应性的、vue 3对它的处理是什么、我们又应该如何实现它。
查看完整目录
专属服务

每个慕课网课程，都是一个专业的技术社区

个性化增值服务，学习有保障更高效

答疑专区+技术社区
连百度谷歌都搜不到的问题，在这里讲
师都将耐心详细解答，更有小伙伴一起
交流互动，共同进步。
课程全套代码下载
提供课程全套源代码下载，包含：
全套组件封装镜像、私有仓库、各个服
务的镜像、项目源代码。
独家“动态”教辅材料
丰富的专属教辅资料上传更新，通过课程
教案、原理图解、技术文档、演示案例等
各种教材，保障你的学习效果。
实用图文资料
课程配置了相应的图文电子文档，与视
频相配合，既保障学习效果，又提高了
学习效率。
适合人群
想要更深入的了解Vue的开发者
要在面试或者竞争中脱颖而出的开发者
技术储备
HTML5/CSS3/JS(ES6)
TypeScript
Vue基础
环境参数
node 14.17.3
npm 7.19.1
Vue 3.2.37
提问
数据加载中...
意见反馈 帮助中心 APP下载
官方微信

学习咨询

选课、学习遇到问题？

扫码添加指导老师 1V1 帮助你！

添加后老师会第一时间解决你的问题