skills/react18-dep-compatibility/SKILL.md
React 18.3.1 and React 19 dependency compatibility matrix.
npx skillsauth add williamlimasilva/.copilot react18-dep-compatibilityInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
Minimum versions required for React 18.3.1 and React 19 compatibility.
Use this skill whenever checking whether a dependency supports a target React version, resolving peer dependency conflicts, deciding whether to upgrade or use legacy-peer-deps, or assessing the risk of a react-router v5 to v6 migration.
Review this matrix before running npm install during a React upgrade and before accepting an npm dependency conflict resolution, especially where concurrent mode compatibility may be affected.
| Package | React 17 (current) | React 18.3.1 (min) | React 19 (min) | Notes |
|---|---|---|---|---|
| react | 17.x | 18.3.1 | 19.0.0 | Pin exactly to 18.3.1 for the R18 orchestra |
| react-dom | 17.x | 18.3.1 | 19.0.0 | Must match react version exactly |
| Package | React 18 Min | React 19 Min | Notes |
|---|---|---|---|
| @testing-library/react | 14.0.0 | 16.0.0 | RTL 13 uses ReactDOM.render internally - broken in R18 |
| @testing-library/jest-dom | 6.0.0 | 6.0.0 | v5 works but v6 has React 18 matcher updates |
| @testing-library/user-event | 14.0.0 | 14.0.0 | v13 is sync, v14 is async - API change required |
| jest | 27.x | 27.x | jest 27+ with jsdom 16+ for React 18 |
| jest-environment-jsdom | 27.x | 27.x | Must match jest version |
| Package | React 18 Min | React 19 Min | Notes |
|---|---|---|---|
| @apollo/client | 3.8.0 | 3.11.0 | 3.8 adds useSyncExternalStore for concurrent mode |
| graphql | 15.x | 16.x | Apollo 3.8+ peer requires graphql 15 or 16 |
Read references/apollo-details.md for concurrent mode issues and MockedProvider changes.
| Package | React 18 Min | React 19 Min | Notes |
|---|---|---|---|
| @emotion/react | 11.10.0 | 11.13.0 | 11.10 adds React 18 concurrent mode support |
| @emotion/styled | 11.10.0 | 11.13.0 | Must match @emotion/react version |
| @emotion/cache | 11.10.0 | 11.13.0 | If used directly |
| Package | React 18 Min | React 19 Min | Notes |
|---|---|---|---|
| react-router-dom | v6.0.0 | v6.8.0 | v5 → v6 is a breaking migration - see details below |
| react-router-dom v5 | 5.3.4 (workaround) | ❌ Not supported | See legacy peer deps note |
react-router v5 → v6 is a SEPARATE migration sprint. Read references/router-migration.md.
| Package | React 18 Min | React 19 Min | Notes |
|---|---|---|---|
| react-redux | 8.0.0 | 9.0.0 | v7 works on R18 legacy root only - breaks on concurrent mode |
| redux | 4.x | 5.x | Redux itself is framework-agnostic - react-redux version matters |
| @reduxjs/toolkit | 1.9.0 | 2.0.0 | RTK 1.9 tested against React 18 |
| Package | React 18 Min | React 19 Min | Notes |
|---|---|---|---|
| react-query / @tanstack/react-query | 4.0.0 | 5.0.0 | v3 doesn't support concurrent mode |
| react-hook-form | 7.0.0 | 7.43.0 | v6 has concurrent mode issues |
| formik | 2.2.9 | 2.4.0 | v2.2.9 patched for React 18 |
| react-select | 5.0.0 | 5.8.0 | v4 has peer dep conflicts with R18 |
| react-datepicker | 4.8.0 | 6.0.0 | v4.8+ added React 18 support |
| react-dnd | 16.0.0 | 16.0.0 | v15 and below have R18 concurrent mode issues |
| prop-types | any | any | Standalone - unaffected by React version |
npm ls shows peer conflict for package X
│
▼
Does package X have a version that supports React 18?
YES → npm install X@[min-compatible-version]
NO ↓
│
Is the package critical to the app?
YES → check GitHub issues for React 18 branch/fork
→ check if maintainer has a PR open
→ last resort: --legacy-peer-deps (document why)
NO → consider removing the package
Only use --legacy-peer-deps when:
Document every --legacy-peer-deps usage in a comment at the top of package.json or in a MIGRATION.md file explaining why it was necessary.
tools
Create a new workshop or use an existing directory as one. Handles two paths: (A) use an existing local directory the operator points at, or (B) create a new private GitHub repo in the signed-in account. Never creates a repo inside another repo.
development
Guide for setting up vcpkg in C++ projects, managing dependency versions, and cross-compiling. Covers manifest initialization, CMake and Visual Studio integration, classic-to-manifest migration, version pinning, baselines, overrides, triplets, and cross-compilation. Use when a user is working with vcpkg project setup, installation, version management, or cross-platform builds. For specialized tasks, additional references cover custom registries and overlay ports (references/registries.md), CI/CD and binary caching (references/ci.md), and troubleshooting and dependency lifecycle (references/troubleshooting.md).
testing
Emit structured agent signals — hands-up, blocked, done, checkpoint, partnership. Signals are written as JSON to .signals/ for dashboard consumption and noted in the journal for persistence.
development
Install and configure Markstream streaming Markdown renderers for Vue, React, Svelte, Angular, Nuxt, and Vue 2 applications. Use for package selection, minimal peer dependencies, CSS order, SSR boundaries, streaming mode, and renderer setup.