Vue源码准备阶段

108 阅读1分钟
1. 下载源码

https://github.com/vuejs/core

2. 安装依赖

通过pnpm install

3. 修改启动命令

"dev": "node scripts/dev.js --sourcemap", 添加--sourcemap

调试:打开页面packages/vue/examples/composition/todomvc.html

可以通过断点以及sourcemap来找到源码位置(右键断点附近的位置,reveal in sidebar)

整体结构:
graph LR
A1-1(vue)-->A2-1(complier-dom)
A1-1-->A2-2(runtime-dom表示扩展浏览器)
A1-1-->A2-3(reactivity)
A2-2-->A3-2(runtime-core表示vue通用代码)