Skip to main content
skill CX Codex

upgrade-react-navigation — Claude Code skill: major version upgrades

A skill that walks the agent through a React Navigation major bump, from 6.x to 7.x or 7.x to 8.x, fixing breaking changes without changing navigation behavior.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓
npx skills add react-navigation/skills --skill upgrade-react-navigation -a claude-code
Open on GitHub

What upgrade-react-navigation does

Reach for this skill when you move React Navigation to a new major version. The agent reads @react-navigation/native in package.json first. On 6.x it opens references/upgrade-6-to-7.md; on 7.x it opens references/upgrade-7-to-8.md. One reference file gets loaded, unless you are deliberately comparing versions.

From there it works through the renamed and dropped APIs: navigate, linking, themes, navigators, screen options. Peer-dependency and tooling bumps belong to the same pass. The policy is narrow — touch only the code the upgrade affects, and pick the simplest change that keeps behavior intact. The patterns inside the skill are starting points rather than a full catalogue, so an unfamiliar construct gets mapped onto the nearest example.

Verification comes after the edits. The package manager is read off package.json or the lockfile, then the project's type checker, linter and tests run where scripts exist. The “Automated checks” and “Manual checks” sections of the loaded reference are walked through as well, and any step that cannot run is reported with a reason. No such scripts in the repo means you verify by hand.

One brake is built in. When a navigator relies on APIs that neither the official docs nor the upgrade reference covers, the skill pauses and asks you before touching code. Same when the upgrade would need a guess about which behavior changes are acceptable.

What it helps with

  • move a project from React Navigation 6.x to 7.x
  • take 7.x up to 8.x without breaking screen transitions
  • track down renamed and removed screen options
  • bump peer dependencies and tooling for the new major
  • run type checks, lint and tests after the navigation upgrade

Example prompts for the agent

  • Upgrade React Navigation to 7.x and handle the breaking changes
  • Check @react-navigation/native in package.json and apply the matching upgrade reference
  • Run the type checker, linter and tests after the navigation upgrade

How to install upgrade-react-navigation

1Skills CLI (Vercel)

npx skills add react-navigation/skills --skill upgrade-react-navigation -a claude-code

2Manually: put the files in place

~/.claude/skills/upgrade-react-navigation/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/upgrade-react-navigation/

Step by step, with commands for each platform: How to install skills in Claude Code: five ways

Questions about upgrade-react-navigation

How do I install upgrade-react-navigation in Claude Code?

Run npx skills add react-navigation/skills --skill upgrade-react-navigation -a claude-code. The skill lands in ~/.claude/skills/upgrade-react-navigation/SKILL.md.

What does upgrade-react-navigation do?

It carries React Navigation to the next major version and applies the required breaking changes while keeping navigation behavior as it was.

When does the skill stop and ask me?

When a navigator uses APIs missing from both the official documentation and the upgrade reference, or when the upgrade would require deciding which behavior changes are acceptable.

Similar skills

Everything for Mobile →

Project sponsors

Companies that keep this analytics open
Gold sponsor

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor