如何看react源码
阅读 React 源码的步骤
克隆 React 仓库
从官方 GitHub 仓库克隆代码：
git clone https://github.com/facebook/react.git了解代码结构
React 源码主要分为以下几个核心目录：
packages/react: 核心 React API 实现packages/react-dom: DOM 渲染相关逻辑packages/scheduler: 调度器实现packages/shared: 共享工具和类型定义
调试源码的方法
使用 yarn link 本地调试
在 React 项目根目录运行：
yarn build
cd build/node_modules/react
yarn link
cd build/node_modules/react-dom
yarn link在测试项目中链接本地 React：
yarn link react react-dom通过 VSCode 调试
- 在 React 项目中配置
launch.json - 添加调试配置指向打包后的源码
关键源码切入点
虚拟 DOM 实现
查看 ReactElement.js 和 ReactDOMComponent.js 了解元素创建和 DOM 操作。
调度系统scheduler 目录下的代码实现了任务调度和时间切片机制。
Hooks 实现ReactHooks.js 和 Hooks.js 包含 useState、useEffect 等 Hook 的核心逻辑。
学习资源推荐
- 官方代码注释：React 源码包含大量解释性注释
- React 设计理念文档：
docs/目录下的设计文档 - 社区解析文章：许多开发者写过 React 源码解析博客
注意事项
建议从 React 16+ 版本开始阅读，因为 Fiber 架构的引入使得代码结构更清晰。可以先关注核心流程，再逐步深入细节实现。
