mcpField
R
react19-source-patterns

react19-source-patterns

github.com/github开发40.5k968 次安装今天更新
代码仓库

关于 react19-source-patterns

react19-source-patterns 是供开发者将源文件迁移到 React 19 的参考指南。它将旧 API 和模式对应到替代方案,并提供配套文档中的详细示例。

主要功能

  1. 01将旧 API 对应到 React 19 替代方案
  2. 02更新渲染与水合调用
  3. 03替换旧式 ref 和 Context 模式
  4. 04保留 propTypes 并添加说明注释

适用场景

  1. 01规划 React 19 源码迁移
  2. 02替换已弃用的 DOM API
  3. 03更新使用 forwardRef 或 defaultProps 的组件

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/github/awesome-copilot --skill react19-source-patterns

安装后在 Claude Code 中输入/react19-source-patterns确认已加载。

附带文件references/api-migrations.md

详细介绍

React 19 源文件迁移模式

React 19 所需的每一项源文件迁移的参考。

快速参考表

模式操作参考
ReactDOM.render(...)→ createRoot().render()参见 references/api-migrations.md
ReactDOM.hydrate(...)→ hydrateRoot(...)参见 references/api-migrations.md
unmountComponentAtNode→ root.unmount()内联修复
ReactDOM.findDOMNode→ 直接 ref内联修复
forwardRef(...) 包装→ ref 作为直接 prop参见 references/api-migrations.md
Component.defaultProps = {}→ ES6 默认参数参见 references/api-migrations.md
useRef() 无参数→ useRef(null)内联修复 添加 null
旧版 Context→ createContext→ api-migrations.md#legacy-context
字符串 ref this.refs.x→ createRef()→ api-migrations.md#string-refs
import React from 'react'(未使用)移除仅当文件中未使用 React. 时

PropTypes 规则

不要移除 .propTypes 赋值。prop-types 包仍可作为独立校验器使用。React 19 仅从 React 包中移除了内置的运行时检查 该包本身仍然有效。

在任何 .propTypes 代码块上方添加此注释:

// NOTE: React 19 no longer runs propTypes validation at runtime.
// PropTypes kept for documentation and IDE tooling only.

阅读参考

有关每个迁移的完整前后代码,请阅读 references/api-migrations.md。它包含完整的模式,包括 forwardRef 与 useImperativeHandle 配合使用的边缘情况、defaultProps 的 null 与 undefined 行为,以及旧版 context provider/consumer 的跨文件迁移。

评论

支持 Markdown