准备工作

代码克隆

React v0.3.0的源代码可以直接从github上获得。在浏览器中访问https://github.com/facebook/react, 可以看到它在Github上的项目信息,通过 git clone [email protected]:facebook/react.git可以直接获取其源代码。

版本切换

截止到落笔时,react刚刚更新到16.0,git上克隆下来的代码默认是最新版本。而本文要分析的是其最早的稳定版v0.3.0,要切换到该分支,只需要通过命令git checkout 0.3-stable或者git checkout v0.3.0即可。

版本说明

v0.3.0 是React项目目前能访问到的最早的stable分支,它包含了React框架最初始的实现思想和具体内容,非常适合深入阅读、学习。

在v0.3.0的源码中,可以发现,项目使用的还是Grunt作为编译管理工具,与之相关的脚步文件包含在根目录的Gruntfile.js和在grunt目录下的其他文件。React源代码都在src目录中,src包含了8个目录,其主要内容描述见下表。

目录 内容
core React的核心类
domUtil Dom操作和CSS操作的相关工具类
environment 当前JS执行环境的基本信息
event React事件机制的核心类
eventPlugins React事件机制的事件绑定插件类
test 测试目录
utils 各种工具类
vendor 可替换模块存放目录

调试说明

由于react使用grunt构建,而最新版本的grunt构建时候报:

Fatal error: module "./build/jasmine/all.js" not found in require()

难以确定0.3-stable是使用哪个版本grunt构建,我们采用构建后的reactjs版本

  • 下载地址

  • 下载后解压把react.js与JSXTransformer.js解压到examples下即可 undefined

  • 在examples下任意一个例子调试页面引用react.js undefined

  • 调试 最后,我们需要启动一个本地服务器进行调试,否则会出现跨域。使用http-server或者其他如local-server等本地服务器随意。

results matching ""

    No results matching ""