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

react18-upgrade — плагин для GitHub Copilot: миграция и установка

Помогает перенести проект с React 16 или 17 на React 18.3.1: проверяет несовместимые API, обновляет зависимости, код компонентов и тесты.

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

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

Плагин ведёт миграцию по этапам: аудит, обновление зависимостей, правки компонентов, проверка автоматического batching и тестов. Он рассчитан на проекты с большим количеством class-компонентов. Среди проверок — небезопасные методы жизненного цикла, legacy context, строковые refs и вызовы ReactDOM.render.

Шесть специализированных агентов координируют перенос, а семь скиллов содержат grep-паттерны и инструкции по миграции API и тестов. Плагин также разбирает переход с Enzyme на React Testing Library, изменения StrictMode и совместимость Apollo Client, Emotion и react-router. Для зависимостей он целится в [email protected] и React Testing Library v14+.

Ставьте плагин, если переносите class-компоненты и хотите пройти миграцию вместе с тестами. Для проекта без таких компонентов большая часть его сценариев может не пригодиться.

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

  • найти небезопасные lifecycle-методы и устаревшие React API
  • перенести legacy context и строковые refs на новые API
  • обновить React и разрешить конфликты зависимостей
  • исправить ошибки из-за automatic batching
  • переписать тесты с Enzyme на React Testing Library

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

  • Начни миграцию моего проекта с React 17 на React 18.
  • Найди в class-компонентах небезопасные lifecycle-методы и предложи замену.
  • Перепиши тесты Enzyme на React Testing Library и проверь StrictMode.

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

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

copilot plugin install react18-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установок

Вопросы о react18-upgrade

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

Выполните copilot plugin install react18-upgrade@awesome-copilot.

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

Плагин помогает переносить проекты с React 16 или 17 на React 18.3.1: проверяет API, обновляет зависимости, компоненты и тесты.

Какие тестовые библиотеки поддерживает миграция?

Плагин помогает обновить React Testing Library до v14+ и переписать тесты с Enzyme на React Testing Library.

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

react18-upgrade · MIT
# React 18 Upgrade Plugin

Enterprise toolkit for migrating React 16/17 class-component codebases to React 18.3.1. Includes six specialized agents and seven skills targeting the specific challenges of upgrading legacy class-heavy applications.

## Installation

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

## What's Included

### Agents

1. **react18-commander** - Master orchestrator that coordinates the entire migration pipeline through audit, dependencies, class-component surgery, automatic batching fixes, and test verification phases.

2. **react18-auditor** - Deep-scan specialist that identifies every React 18 breaking change: unsafe lifecycle methods, legacy context, string refs, batching vulnerabilities, and all deprecation patterns.

3. **react18-dep-surgeon** - Dependency upgrade specialist that pins [email protected] exactly, upgrades testing-library to v14+, resolves all peer conflicts, and returns GO/NO-GO confirmation.

4. **react18-class-surgeon** - Lifecycle and API migration specialist that performs semantic migrations for:
   - `componentWillMount` → `componentDidMount` or constructor
   - `componentWillReceiveProps` → `getDerivedStateFromProps` or `componentDidUpdate`
   - `componentWillUpdate` → `getSnapshotBeforeUpdate` or `componentDidUpdate`
   - Legacy Context → `createContext`
   - String refs → `React.createRef()`
   - `findDOMNode` → direct refs
   - `ReactDOM.render` → `createRoot`

5. **react18-batching-fixer** - Automatic batching regression specialist that identifies and fixes the #1 silent runtime breaker in React 18: setState calls in async methods that relied on immediate intermediate re-renders.

6. **react18-test-guardian** - Test suite fixer that handles Enzyme-to-RTL rewrites, RTL v14 API updates, automatic batching test regressions, StrictMode double-invoke changes, and runs tests until zero failures.

### Skills

1. **react-audit-grep-patterns** - Reference grep patterns for auditing React 18 deprecations across class components.

2. **react18-batching-patterns** - Patterns and strategies for identifying and fixing automatic batching regressions.

3. **react18-dep-compatibility** - Dependency compatibility matrix for React 18 with migration paths for testing-library, Apollo, Emotion, react-router.

4. **react18-enzyme-to-rtl** - Complete guide for rewriting Enzyme tests to React Testing Library (RTL v14+).

5. **react18-legacy-context** - Migration patterns for legacy context API → `createContext`.

6. **react18-lifecycle-patterns** - Detailed migration patterns for all three unsafe lifecycle methods.

7. **react18-string-refs** - Reference implementations for migrating string refs to `React.createRef()`.

## Quick Start

```
Ask: "Start implementing React 18 migration for my class-component codebase"
```

The react18-commander will guide you through:

1. Audit → identify all breaking changes
2. Deps → upgrade to [email protected] + compatible libraries
3. Class Surgery → migrate lifecycle methods and APIs
4. Batching Fixes → fix automatic batching regressions
5. Tests → migrate test suite and run to green

## Why React 18.3.1?

React 18.3.1 was released to surface **explicit warnings** for every API that React 19 will remove. A clean 18.3.1 run with zero warnings is the direct prerequisite for the React 19 migration.

## Key Features

- ✅ Targets class-component-heavy codebases (NOT just functional component patterns)
- ✅ Automatic batching issue detection and `flushSync` recommendations
- ✅ Enzyme test detection with full RTL rewrite capability
- ✅ Memory-based resumable pipeline - survive interruptions
- ✅ Zero tolerance for incomplete migrations - run to full success
- ✅ StrictMode-aware test fixes
- ✅ Apollo Client, Emotion, react-router compatibility handling

## Source

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

## License

MIT

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

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

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

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