Loading [MathJax]/jax/output/CommonHTML/config.js

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >专栏 >react源码调试

react源码调试

作者头像

刘嘿哈

发布于 2022-10-25 06:22:26

发布于 2022-10-25 06:22:26

51300

代码可运行

举报

文章被收录于专栏：js笔记js笔记

运行总次数：0

代码可运行

clone源码

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

安装依赖

cd react
yarn

build源码

npm run build react/index,react/jsx,react-dom/index,scheduler --type=NODE

为源码创建软链

cd build/node_modules/react
npm link
cd build/node_modules/react-dom
npm link

create-react-app创建项目

npx create-react-app demo
cd demo
npm link react react-dom

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2022-03-02，如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

评论

登录后参与评论

暂无评论

编辑精选文章

换一批

万字详解高可用架构设计

Go 开发者必备：Protocol Buffers 入门指南

10分钟带你彻底搞懂分布式链路跟踪

多租户的 4 种常用方案

亿级月活的社交 APP，陌陌如何做到 3 分钟定位故障？

60页PPT全解：DeepSeek系列论文技术要点整理

渲染 html react javascript 网站

JSX是JavaScript XML的简写，表示了在Javascript代码中写XML(HTML)格式的代码

用户10169043

2022/11/18

2.1K0

用于构建用户界面的JavaScript库---＞React

html react 渲染 javascript

现在我们使用开发工具打开我们刚刚下载的项目，大家可以使用 Webstorm ， HBuilder X , Visual Studio Code 。我使用 Webstorm 。

叫我阿杰好了

2022/11/07

1.3K0

用于构建用户界面的JavaScript库---＞React

react源码解析4.源码目录结构和调试

方法一：可以用现成的包含本课程所有demo的项目来调试，建议使用已经构建好的项目，地址：https://github.com/xiaochen1024/react_code_build

全栈潇晨

2021/06/03

7330

2.react心智模型(来来来,让大脑有react思维吧)

视频课程的目的是为了快速掌握react源码运行的过程和react中的scheduler、reconciler、renderer、fiber等，并且详细debug源码和分析，过程更清晰。

zz1998

2021/12/09

7630

React源码学习进阶篇（一）新版React如何调试源码？

react ide rollup.js json webpack

我们先启用VSCode的调试模式，在项目下新建一个launch.json（注意我这里cra启动的端口是3001）：

孟健

2022/12/19

1.1K0

React源码学习进阶篇（一）新版React如何调试源码？

找准切入点，调试看源码，事半功倍

vue.js 官方文档 npm cdn 腾讯云开发者社区

说到看源码，很多人都有个误区，觉得看源码必须要到 github 上把完整的代码 clone 下来，认为只有把完整的代码下载下来，才能开始愉快的学习。

若川

2020/12/15

1.2K0

找准切入点，调试看源码，事半功倍

React环境搭建

react npm yarn vue.js node.js

React是当下前端生态圈流行的框架之一，与Vue和Angular并称前端三架马车。今天，我们就一起来学习下React，今天的主要内容有。

江涛学编程

2020/07/24

1.6K0

React入门系列（一）构建项目

webpack 打包 javascript react npm

React是一个专注于View层解决方案的框架。于Angular，Vue不同，React并不是完整的MVC/MVVM框架，也不是单纯的模板引擎，它的核心思想就是“组件化”，将UI层拆分为一个个组件，然后组合嵌套，最后构建成完成的APP。

娜姐

2021/01/14

7560

全网最优雅的 React 源码调试方式

react 编程算法 ide webpack javascript

东东是一名前端工程师，主要用 React 技术栈，用了多年之后想深入一下，所以最近开始看 React 源码。

神说要有光zxg

2022/11/11

1.8K0

全网最优雅的 React 源码调试方式

React.js基础知识总结一

webpack 打包 html yarn node.js

React是FaceBook（脸书）公司研发的一款JS框架（MVC） React是一款框架：具备自己开发的独立思想(MVC：Model View Controller) -> 划分组件开发 -> 基于路由的SPA单页面开发 -> 基于ES6来编写代码(最后部署上线的时候，我们需要把ES6编译成ES5 =>基于Babel来完成编译) -> 可能用到Less/Sass等，我们也需要使用对应的插件把他们进行预编译 -> 最后为了优化性能（减少HTTP请求次数），我们需要把JS或者CSS进行合并压缩 -> webpack来完成以上页面组件合并、JS/CSS编译加合并等工作

用户6379025

2022/12/26

1.9K0

React.js基础知识总结一

（1）React的开发

React 使创建交互式 UI 变得轻而易举。为你应用的每一个状态设计简洁的视图，当数据改变时 React 能有效地更新并正确地渲染组件。

达达前端

2019/07/09

7080

为什么说 90% 的前端不会调试 Ant Design 源码？

babel.js webpack 编程算法打包 react

写 react 项目的小伙伴应该都用过 antd 组件库，但绝大多数同学并没有看过它的源码。

神说要有光zxg

2022/11/11

1.2K0

为什么说 90% 的前端不会调试 Ant Design 源码？

基于create-react-app构建多页面应用框架

运行这些命令会在当前目录中创建一个名为 multiple-page 的目录。在该目录中，它将生成初始项目结构并安装依赖项，目录结构如下所示(tree -I "node_modules")：

lqmeta

2020/07/05

5.4K3

基于create-react-app构建多页面应用框架

01-React搭建react环境及SCSS的配置

零、前言关于React不做自我介绍了。 create-react-app 快速搭建React环境，自带热加载，服务器。电脑与手机在同一wifi下可以通过ip访问项目，实现手机电脑同时预览

张风捷特烈

2018/09/29

2.3K0

01-React搭建react环境及SCSS的配置

React 学习笔记之创建 React 项目

在 src/index.js 中有如下代码，程序首先导入了 React 和 ReactDom 模块，并导入了一个当前目录下的 App 模块。随后在代码中使用 ReactDOM.render 将 App 模块渲染到了界面上。这个 App 在 React 中称为组件(component)。而这个组件渲染到什么位置则是第二个参数 document.getElementById(‘root’) 决定的，它从 index.html 中获取到了 root 节点，并将 App 插入到 root 节点下。

我与梦想有个约会

2020/01/04

7480

React脚手架 create-react-app 快速上手教程Kotlin 开发者社区

You can now view hello-react-demo in the browser.

一个会写诗的程序员

2018/12/12

9640

create-react-app入门教程

css npm https 网络安全 javascript

Create React App是FaceBook的React团队官方出的一个构建React单页面应用的脚手架工具。它本身集成了Webpack，并配置了一系列内置的loader和默认的npm的脚本，可以很轻松的实现零配置就可以快速开发React的应用。

老马

2019/05/25

2.5K0

初识package.json，两个重要字段不能忽略

react npm 命令行工具 git http

我选择在本地搭建 React 开发环境，这与实践更加接近。在初学时，我们可以通过 Create React App 创建项目。它是 React 初学者创建单页应用的最佳方式。

用户6901603

2022/05/24

7480

初识package.json，两个重要字段不能忽略

现代前端工程化-基于 Monorepo 的 lerna 模块(从原理到实战)

网站 javascript yarn 编程算法 npm

看完本文后希望可以检查一下图中的内容是否都掌握了，文中的例子最好实际操作一下，下面开始正文。

前端迷

2021/04/09

4.1K1

现代前端工程化-基于 Monorepo 的 lerna 模块(从原理到实战)

详解从 0 发布 react 组件到 npm 上

之前我发布了我的第一个 npm 组件，一个基于 react 的 3d 标签云组件。在这途中我也是遇到了很多的坑，花在完善整个发布流程的时间远多于写这个组件本身的时间，所以我记录下我觉得一个正常的 react 组件的发布流程

桃翁

2019/03/04

1.6K0

详解从 0 发布 react 组件到 npm 上

相关推荐

React 基础

更多 >

LV.1

快手前端

作者相关精选

换一批

目录

clone源码

安装依赖

build源码

create-react-app创建项目

加入讨论

的问答专区 >

1北京宏哥擅长4个领域

相关课程

一站式学习中心 >

云开发微搭低代码平台-一人构建企业级应用实战训练营

腾讯云微搭低代码

AI代码助手快速上手训练营

腾讯云代码助手

本文部分代码块支持一键运行，欢迎体验

本文部分代码块支持一键运行，欢迎体验