下载react源码
第一步首先当然是下载与源码啦,可以自行在github上下载
git clone git@github.com:facebook/react.git
源码打包
源码下下来后,肯定是需要build一下才能给我们调试项目使用的
先安装一下依赖
// ~/path_to_your_react_clone/
yarn
然后就开始打包啦
yarn build react/index react/jsx react-dom/index scheduler --type=NODE
多个包打包的时候注意名称之间用空格分开,不要用逗号,这是一个坑,我按照官网上的逗号就没成功过
也可以直接yarn build 全量打包,但是全量打包会很慢,而且很多包我们也是用不到的
打包过程中可能会报错:
去官网下一下jdk安装就好了 www.oracle.com/java/techno…
建立npm link(yarn link)连接
在需要引用的包产物目录下运行npm link命令:
cd build/node_modules/react
yarn link
cd build/node_modules/react-dom
yarn link
最后在项目中引入就好啦
cd ~/path/to/your/project
yarn link react react-dom
ok,结束!
踩坑
在修改react源码并重新build后,webpack打包发现修改没有生效在项目中的nodemodules目录下发现源码已经改变,但是在实际浏览器中没有生效,此时可以手动修改构建后的产物代码,此时源码改动会生效。推测是webpack打包时启用了缓存,引用库代码时直接利用了缓存,从而在库源码的改动没有生效。