React 包:

  • react:公用方法(外部暴露),宿主环境无关
  • react-reconciler:协调器(核心逻辑),宿主环境无关
  • shared:公用辅助方法及类型定义(内部使用),宿主环境无关
  • 各种宿主环境的包
    • react-dom:浏览器宿主环境

JSX 转换属于 react

JSX 转换是什么

包括两部分:

  • 编译时:由 babel 实现,将 JSX 代码编译成对应方法调用
    • jsxDEV:React17 后,Dev 环境
    • jsx:React17 后,Prod 环境
    • React.createElement:React17 前
  • 运行时:对应方法的实现

如:

<div id="div">123</div>

会被 babel 编译成:

import { jsx as _jsx } from "react/jsx-runtime";
 
/*#__PURE__*/_jsx("div", {
  id: "div",
  children: "123"
});
 
// 或
/*#__PURE__*/React.createElement("div", { id: "div" }, "123");

实现 JSX 方法