upgrading-expo
Skill274 starsChanged 8 months agoMITView on GitHub
Guidelines for upgrading Expo SDK versions and fixing dependency issues
- Deletes or force-pushes
15 other projects use a version of this, 9 of them edited.
Adopted by
Most recently taken up by
- elbionredenica/consumer-app-starteredited, first seen Nov 8, 2026
- nnawar706/fluentoedited, first seen Nov 8, 2026
- xfstudio/skillstheir own version, first seen Oct 13, 2026
- openai/pluginsword for word, first seen Oct 13, 2026
- Samueladewole/claude-skillsedited, first seen Oct 13, 2026
- willlee1995/skillsedited, first seen Oct 13, 2026
Used with
Projects with it also use web-design-guidelines, improve-codebase-architecture and 1 more.
Other files people use alongside this one.
Files found in the same public projects as a version of this one, more often than they turn up anywhere else. Each project counts once, large collections count for less, and this file's own repository is left out.
VercelSkillweb-design-guidelines
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
Also in 3 projects that use this
GoogleSkillimprove-codebase-architecture
Scan a codebase for deepening opportunities, present them as a visual HTML report, then grill through whichever one you pick.
Also in 3 projects that use this
GoogleSkillgrill-me
A relentless interview to sharpen a plan or design.
Also in 3 projects that use this
Other versions15 projects use a version of this.
Word for word · 4
- openai/plugins★ 7.8k100% same
- kingstinct/react-native-healthkit★ 719100% same
- robinebers/skills★ 48100% same
- PIXARTSeu/Synapse★ 9100% same
Edited · 9
- CherryHQ/cherry-studio-app★ 4.1k94% same
- bbplayer-app/BBPlayer★ 1.4k94% same
- binnicordova/expo-boilerplate★ 1195% same
- pepebot-space/skills★ 221% same
- willlee1995/skills★ 195% same
- elbionredenica/consumer-app-starter★ 084% same
- kennethkeim/skills★ 098% same
- nnawar706/fluento★ 094% same
- Samueladewole/claude-skills★ 095% same
Wrote their own version · 2
- xfstudio/skills★ 9same name
- ai4brands-design/claude-skills★ 2same name
How matches are found. Word for word: the exact same text. Edited: shares passages with this file (“99% same” means 99% of its five-word phrases also appear here; 10% or more counts). Their own version: similar meaning, or, weakest, the same name. We can’t tell which project had it first. Projects are counted among the 200 most-starred candidates, and mentions are links to the repository we found, up to 50 per site, so both counts are a floor.
In this repository22 other files it gives its agents.
- CLAUDE.mdCLAUDE.md
- agent-browserSkill
- autoresearchSkill
- building-native-uiSkill
- expo-api-routesSkill
- expo-cicd-workflowsSkill
- expo-deploymentSkill
- expo-dev-clientSkill
- expo-tailwind-setupSkill
- expo-ui-jetpack-composeSkill
- expo-ui-swift-uiSkill
- just-bashSkill
- nano-bananaSkill
- native-data-fetchingSkill
- qa-device-managementSkill
- qa-scrollSkill
- qa-setupSkill
- qa-state-persistenceSkill
- qa-test-flowsSkill
- qa-webSkill
- slack-webSkill
- use-domSkill
The file
Show its rules and text
We split this skill into the rules it gives an agent
16 rules. 7 are common, 1 is distinctive, and 8 are very specific to this project.
7
Common
Most of the 10 edited versions we read keep these.
1
Distinctive
This author's own choices. Worth a look.
8
Very specific
Tied to their project's names, files or tools. Probably skip.
- Common
- Distinctive
- Very specific
- Very specific: line 21
Check if latest is beta: https://exp.host/--/api/v2/versions (look for -preview in expoVersion)
- Common: line 48
Check for removed APIs in release notes
- Common: line 49
Update import paths for moved modules
- Common: line 51
Test all camera, audio, and video features
- Common: line 52
Verify navigation still works correctly
- Common: line 58
If upgrading requires native changes:
- Common: line 77
If using Expo SDK 54 or later, ensure react-native-worklets is installed — this is required for react-native-reanimated to work.
- Very specific: line 79
Delete sdkVersion from app.json to let Expo manage it automatically
- Very specific: line 80
Remove implicit packages from package.json: @babel/core, babel-preset-expo, expo-constants.
- Very specific: line 81
If the babel.config.js only contains 'babel-preset-expo', delete the file
- Very specific: line 82
If the metro.config.js only contains expo defaults, delete the file
- Distinctive: line 95
When migrating deprecated packages, update all code usage before removing the old package.
- Very specific: line 99
Check if package.json has excluded packages:
- Very specific: line 110
Check if there are any outdated patches in the patches/ directory.
- Very specific: line 115
Use postcss.config.mjs in SDK +53.
- Common: line 119
Remove redundant metro config options:
“Common” is measured: kept by at least 6 in 10 of the 10 edited versions of this file we could read. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.
Files
References
- ./references/new-architecture.md -- SDK +53: New Architecture migration guide
- ./references/react-19.md -- SDK +54: React 19 changes (useContext → use, Context.Provider → Context, forwardRef removal)
- ./references/react-compiler.md -- SDK +54: React Compiler setup and migration guide
- ./references/native-tabs.md -- SDK +55: Native tabs changes (Icon/Label/Badge now accessed via NativeTabs.Trigger.*)
- ./references/expo-av-to-audio.md -- Migrate audio playback and recording from expo-av to expo-audio
- ./references/expo-av-to-video.md -- Migrate video playback from expo-av to expo-video
Beta/Preview Releases
Beta versions use .preview suffix (e.g., 55.0.0-preview.2), published under @next tag.
Check if latest is beta: https://exp.host/--/api/v2/versions (look for -preview in expoVersion)
npx expo install expo@next --fix # install betaStep-by-Step Upgrade Process
- Upgrade Expo and dependencies
npx expo install expo@latest
npx expo install --fix- Run diagnostics:
npx expo-doctor - Clear caches and reinstall
npx expo export -p ios --clear
rm -rf node_modules .expo
watchman watch-del-allBreaking Changes Checklist
- Check for removed APIs in release notes
- Update import paths for moved modules
- Review native module changes requiring prebuild
- Test all camera, audio, and video features
- Verify navigation still works correctly
Prebuild for Native Changes
First check if ios/ and android/ directories exist in the project. If neither directory exists, the project uses Continuous Native Generation (CNG) and native projects are regenerated at build time — skip this section and "Clear caches for bare workflow" entirely.
If upgrading requires native changes:
npx expo prebuild --cleanThis regenerates the ios and android directories. Ensure the project is not a bare workflow app before running this command.
Clear caches for bare workflow
These steps only apply when ios/ and/or android/ directories exist in the project:
- Clear the cocoapods cache for iOS:
cd ios && pod install --repo-update - Clear derived data for Xcode:
npx expo run:ios --no-build-cache - Clear the Gradle cache for Android:
cd android && ./gradlew clean
Housekeeping
- Review release notes for the target SDK version at https://expo.dev/changelog
- If using Expo SDK 54 or later, ensure react-native-worklets is installed — this is required for react-native-reanimated to work.
- Enable React Compiler in SDK 54+ by adding
"experiments": { "reactCompiler": true }to app.json — it's stable and recommended - Delete sdkVersion from
app.jsonto let Expo manage it automatically - Remove implicit packages from
package.json:@babel/core,babel-preset-expo,expo-constants. - If the babel.config.js only contains 'babel-preset-expo', delete the file
- If the metro.config.js only contains expo defaults, delete the file
Deprecated Packages
| Old Package | Replacement |
expo-av | expo-audio and expo-video |
expo-permissions | Individual package permission APIs |
@expo/vector-icons | expo-symbols (for SF Symbols) |
AsyncStorage | expo-sqlite/localStorage/install |
expo-app-loading | expo-splash-screen |
| expo-linear-gradient | experimental_backgroundImage + CSS gradients in View |
When migrating deprecated packages, update all code usage before removing the old package. For expo-av, consult the migration references to convert Audio.Sound to useAudioPlayer, Audio.Recording to useAudioRecorder, and Video components to VideoView with useVideoPlayer.
expo.install.exclude
Check if package.json has excluded packages:
{
"expo": { "install": { "exclude": ["react-native-reanimated"] } }
}Exclusions are often workarounds that may no longer be needed after upgrading. Review each one.
Removing patches
Check if there are any outdated patches in the patches/ directory. Remove them if they are no longer needed.
Postcss
autoprefixerisn't needed in SDK +53. Remove it from dependencies and checkpostcss.config.jsorpostcss.config.mjsto remove it from the plugins list.- Use
postcss.config.mjsin SDK +53.
Metro
Remove redundant metro config options:
- resolver.unstable_enablePackageExports is enabled by default in SDK +53.
experimentalImportSupportis enabled by default in SDK +54.EXPO_USE_FAST_RESOLVER=1is removed in SDK +54.- cjs and mjs extensions are supported by default in SDK +50.
- Expo webpack is deprecated, migrate to Expo Router and Metro web.
Hermes engine v1
Since SDK 55, users can opt-in to use Hermes engine v1 for improved runtime performance. This requires setting useHermesV1: true in the expo-build-properties config plugin, and may require a specific version of the hermes-compiler npm package. Hermes v1 will become a default in some future SDK release.
New Architecture
The new architecture is enabled by default, the app.json field "newArchEnabled": true is no longer needed as it's the default. Expo Go only supports the new architecture as of SDK +53.
Does it work?
Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.
No reviews yet
People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.
- It worked
- Partly
- It didn't
Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.
Your trail
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
Now do this for your own.
Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

