К основному содержанию
плагин GitHub Copilot официальный · GitHub

react19-upgrade — плагин для GitHub Copilot: как установить

Автоматизирует переход кодовой базы с React 18 на React 19. Пригодится, когда нужно устранить устаревшие API и починить упавшие тесты без ручной правки компонентов.

Установить в GitHub Copilot · Команда из источника Все способы и платформы ↓
copilot plugin install react19-upgrade@awesome-copilot
Открыть на GitHub

Что делает react19-upgrade

Плагин запускает цепочку из пяти агентов под управлением react19-commander. Сначала react19-auditor сканирует проект на устаревшие вызовы вроде ReactDOM.render, findDOMNode, строковые рефы и устаревший контекст. Затем react19-dep-surgeon обновляет зависимости до react@19 и @testing-library/react@16+, проверяя конфликты пакетов.

После аудита react19-migrator переписывает исходники. Он убирает forwardRef в пользу прямого пропа ref, переводит defaultProps на ES6-значения по умолчанию и меняет useRef() на useRef(null). Агент react19-test-guardian исправляет импорты act, меняет Simulate на fireEvent и правит проверки вызовов под новый StrictMode, пока все тесты не станут зелеными.

Инструмент рассчитан строго на проекты с React 18. Если приложение все ещё работает на версиях 16 или 17, сначала придется дойти до React 18.3.1 плагином react18-upgrade. Ставить его стоит командам с большим легаси, где ручная миграция рискует затянуться.

Какие задачи решает

  • найти удаленные и устаревшие API React 18 перед обновлением
  • переписать ReactDOM.render на createRoot и hydrate на hydrateRoot
  • заменить forwardRef на прямую передачу пропа ref
  • перевести импорты act из react-dom/test-utils в react
  • обновить зависимости до react@19 и решить конфликты peer-пакетов

Примеры запросов агенту

  • Start implementing React 19 migration for my codebase
  • Найди все устаревшие API React 19 в проекте и подготовь аудит
  • Обнови зависимости до React 19 и поправь тесты

Как установить react19-upgrade

Команда из источника

copilot plugin install react19-upgrade@awesome-copilot

Из того же набора554

Весь набор →
git-commit официальный github Скилл разбирает изменения Git, выбирает связанные файлы и создаёт коммит в формате Conventional Commits. Пригодится, когда нужно закоммитить одну или несколько логических частей изменений. GitHub Copilot 47 165установок excalidraw-diagram-generator официальный github Скилл превращает описание на обычном языке в диаграмму Excalidraw. Подойдёт, когда нужно показать процесс, связи между объектами или устройство системы. GitHub Copilot 31 639установок multi-stage-dockerfile официальный github Скилл помогает создавать многоэтапные Dockerfile для разных языков и фреймворков. Пригодится, когда важны размер и состав runtime-образа. GitHub Copilot 29 688установок documentation-writer официальный github Скилл для создания технической документации по фреймворку Diátaxis: туториалы, гайды, справки и объяснения. Предлагает структуру перед написанием. GitHub Copilot 27 757установок prd официальный github Собирает из идеи структурированный PRD с пользовательскими историями, техническими требованиями и рисками. Подходит для планирования новых функций, в том числе с AI. GitHub Copilot 24 035установок refactor официальный github Скилл помогает менять структуру кода без изменения внешнего поведения. Подойдёт для постепенной уборки сложных функций, дублирования и кодовых запахов. GitHub Copilot 22 321установок java-springboot официальный github Задаёт практики разработки Spring Boot-приложений: от структуры проекта до тестов и безопасности. Пригодится, когда Copilot пишет или проверяет Java-код. GitHub Copilot 21 272установок create-readme официальный github Скилл изучает проект и создаёт структурированный README.md. Подойдёт, когда документацию нужно собрать по коду и файлам проекта. GitHub Copilot 19 081установок

Вопросы о react19-upgrade

Как установить react19-upgrade в GitHub Copilot?

Выполните команду copilot plugin install react19-upgrade@awesome-copilot. Для Claude Code используйте /plugin marketplace add github/awesome-copilot и /plugin install react19-upgrade@awesome-copilot.

Что делает react19-upgrade?

Плагин запускает поэтапную миграцию: находит несовместимый синтаксис, обновляет зависимости, переписывает устаревшие компоненты и перезапускает тесты до нулевого числа ошибок.

Можно ли обновиться с React 16 или 17 напрямую?

Нет, плагин требует готовую базу на React 18. Для более старых версий сначала выполните обновление до React 18.3.1 через плагин react18-upgrade.

Исходный текст

react19-upgrade · MIT
# React 19 Upgrade Plugin

Enterprise toolkit for migrating React 18 codebases to React 19. Includes five specialized agents and three skills targeting the specific challenges of upgrading to React 19's modern API surface.

## Installation

```bash
copilot plugin install react19-upgrade@awesome-copilot
```

## What's Included

### Agents

1. **react19-commander**  Master orchestrator that coordinates the entire migration pipeline through audit, dependencies, source code migration, and test verification phases.

2. **react19-auditor**  Deep-scan specialist that identifies every React 19 breaking change and deprecated pattern:
   - Removed APIs: `ReactDOM.render`, `ReactDOM.hydrate`, `unmountComponentAtNode`, `findDOMNode`, `createFactory`, `react-dom/test-utils` exports
   - Legacy Context API (`contextTypes`, `childContextTypes`, `getChildContext`)
   - String refs (`this.refs.x`)
   - Deprecated patterns: `forwardRef`, `defaultProps` on function components, `useRef()` without initial value
   - Test-specific issues: `act` import location, `Simulate` usage, StrictMode changes

3. **react19-dep-surgeon**  Dependency upgrade specialist that upgrades to react@19, handles @testing-library/react@16+, resolves all peer conflicts, and returns GO/NO-GO confirmation.

4. **react19-migrator**  Source code migration engine that rewrites required React 19 changes and can apply optional modernizations for deprecated patterns:  
   - `ReactDOM.render` → `createRoot`  
   - `ReactDOM.hydrate` → `hydrateRoot`  
   - `unmountComponentAtNode` → `root.unmount()`  
   - `findDOMNode` → direct refs  
   - Optional modernization: `forwardRef` → ref as direct prop  
   - `defaultProps` → ES6 defaults
   - Legacy Context → `createContext`
   - String refs → `createRef`
   - `useRef()` → `useRef(null)`
   - `propTypes` → documentation comments

5. **react19-test-guardian**  Test suite fixer that handles:
   - `act` import fixes (react-dom/test-utils → react)
   - `Simulate` → `fireEvent` migrations
   - StrictMode spy call count deltas (no more double-invoke in React 19)
   - `useRef` shape updates
   - Custom render helper verification
   - Error boundary test updates
   - Runs tests until zero failures

### Skills

1. **react19-concurrent-patterns**  Deep patterns for React 19 concurrent features including Suspense, use() Hook, Server Components integration, and concurrent batching.

2. **react19-source-patterns**  Migration patterns for source API changes including DOM/root APIs, refs, and context updates.

3. **react19-test-patterns**  Comprehensive test migration guide covering `act()` semantics, error boundary testing, and StrictMode behavioral changes.

## Quick Start

```
Ask: "Start implementing React 19 migration for my codebase"
```

The react19-commander will guide you through:

1. Audit → identify all breaking changes
2. Deps → upgrade to react@19 + compatible libraries
3. Migrate → fix all deprecated APIs and patterns
4. Tests → migrate test suite and run to green

## Breaking Changes from React 18

### Removed APIs

- `ReactDOM.render()`  use `createRoot()`
- `ReactDOM.hydrate()`  use `hydrateRoot()`
- `ReactDOM.unmountComponentAtNode()`  use `root.unmount()`
- `ReactDOM.findDOMNode()`  use direct refs
- `React.createFactory()`  use JSX
- `react-dom/test-utils` exports
- Legacy Context API
- String refs

### Deprecated Patterns (Still work but should migrate)

- `forwardRef`  ref is now a direct prop
- `defaultProps` on function components  use ES6 defaults
- `useRef()` without initial value  pass `null`

### Behavioral Changes

- StrictMode no longer double-invokes effects (affects test call count assertions)
- `propTypes` runtime validation removed (keep for documentation, but no runtime checks)

## Key Features

- ✅ Comprehensive removal of 8+ deprecated React APIs
- ✅ Handles complex patterns: legacy context, forwardRef, defaultProps
- ✅ Memory-based resumable pipeline  survive interruptions
- ✅ Zero tolerance for incomplete migrations  run to full success
- ✅ StrictMode-aware test fixes
- ✅ Testing-library v16+ compatibility verification
- ✅ Error boundary and async test pattern updates

## Prerequisite

This plugin assumes you're migrating from **React 18** codebases. If you're on React 16/17, use the **react18-upgrade** plugin first to reach React 18.3.1, then use this plugin for the React 19 final upgrade.

## Source

This plugin is part of [Awesome Copilot](https://github.com/github/awesome-copilot).

## License

MIT

© Awesome Copilot Community · MIT · github/awesome-copilot

Смотрите также

Спонсоры проекта

Компании, которые помогают держать аналитику открытой