vue3核心学习

官方仓库

https://github.com/vuejs/core

目录结构

需要关注的，主要的目录就两个
package：源码都放在这里
scripts：脚本文件，配置文件，编译和打包用

核心模块
  1. reactivity，响应式模块。主要职责：监听响应式数据，进行响应式操作
  2. compiler，编译时模块。主要职责：编译，将template模版编译成render函数
  3. runtime，运行时模块。主要职责：渲染，将虚拟dom渲染到真实dom上
源码调试

package.json中的脚本命令，主要关注，dev和build。
1.dev：实时编译，修改vue源码会实时编译
2.build：打包到dist下

执行
pnpm run build
在package/vue目录下生成dist文件夹，针对不同模块打包成不同的文件

此时我们就可以编写测试文件。在packages/vue/example目录为vue提供了很多示例页面, 每个页面都引入Vue构建后的文件./packages/vue/dist/vue.global.js。这些文件都可以调试，也可以在此目录新建测试文件。在浏览器中运行测试文件, F12打开开发工具, 在源代码栏找到测试文件打上断点，即可开始调试。