「这是我参与2022首次更文挑战的第7天，活动详情查看：2022首次更文挑战」
前言
我们为什么要读源码？
从业前端好几年，作为一名基层开发人员，实际上并不太用的到源码，会发现辛辛苦苦去看那些抽象的东西，工作中还未必有你多记的几个API更靠谱，让你写代码更快，做东西效率更高。
但是这个东西就像是英语、数学、设计模式、编译原理，它不能决定你的下限，但是可以影响你的上限。
同样都是程序员，没有跻身很好公司、遇见流批同事的你，在现在这个信息相对更发达、学习氛围更开放的环境，也可以有机会写出更设计完整、架构清晰、方案明确、上限高级的代码。答案就在这些大佬们的源码中。
但是大佬之所以为大佬的原因就是人家的知识储备非常的丰富，我们作为没有经验的前端人，没有计划没有准备的一头埋入源码，那一定会遇见很多的坑、走很多的弯路。
今年准备开始读源码的菜狗作者，会将自己从无到有的读源码经验梳理为成套的文章。一则是为自己留下笔记，二则是为后来者引路。（菜狗如作者都行，那你一定也可以。夯实基础，加油！）
环境搭建
Clone项目
阅读源码最最基础的操作就是要先找到你要对应阅读的源码，clone到本地
命令如下：
git clone https://github.com/vuejs/vue-next.git
安装依赖
Vue的构建工具使用的是pnpm,它用起来跟npm、yarn一样，我们先安装
npm install -g pnpm或者brew install pnpm,详见：www.pnpm.cn/installatio…
pnpm install
配置文件调整
对package.json进行调整
"dev": "node scripts/dev.js --sourcemap"
del "puppeteer": "^10.0.0"
从设置中可以看出来
打包：pnpm dev
开启服务：pnpm serve
项目中有一个example文件夹，里面有一些测试页面，我们先暂时找一个简单的页面，路径下面
vue/example/companization/todomvc
调试
这部分主要的活动区域在source，打开浏览器控制台
进入todo主页，cmd + p
找到对应源码文件：review in side bar
