react如何看源代码

查看 React 源码的方法

克隆官方仓库
React 的源代码托管在 GitHub 上，可以通过以下命令克隆仓库：

git clone https://github.com/facebook/react.git

克隆后切换到目标版本分支（如 main 或特定版本标签）。

使用在线代码浏览工具
GitHub 直接浏览 React 仓库的文件结构：
访问 https://github.com/facebook/react，通过目录导航查看 packages 下的核心模块（如 react、react-dom）。

关键目录说明

• packages/react: 包含 React 核心逻辑（如组件、Hooks）。
• packages/react-dom: 渲染相关代码（DOM 操作）。
• packages/scheduler: 任务调度实现。

调试本地 React 源码

通过 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

使用 sourcemap 调试
修改项目配置（如 Create React App 的 react-scripts 配置）以加载本地构建的带 sourcemap 的 React 文件。

阅读源码的技巧

从入口文件开始

• React 的入口文件通常为 packages/react/src/React.js。
• ReactDOM 的入口为 packages/react-dom/src/client/ReactDOM.js。

核心流程关注点

• 虚拟 DOM 结构（ReactElement）。
• 协调算法（Reconciliation）在 react-reconciler 包中。
• Hooks 实现位于 packages/react/src/ReactHooks.js。

参考工具

使用 IDE 辅助
VS Code 或 WebStorm 的代码跳转功能可快速追踪函数定义和引用。

官方文档与注释
React 源码包含详细注释，尤其是类型定义（Flow/Typescript）和关键算法部分。