Environment
- React Native: 0.86.0
- Gluestack UI CLI: latest
- NativeWind: 4.1.23
- Node: 24.x
- Platform: macOS (Apple Silicon)
Problem
Running npx gluestack-ui init on a fresh RN 0.86 project
overwrites babel.config.js and replaces the correct preset:
// Correct (RN 0.72+)
presets: ['@react-native/babel-preset']
with the deprecated one:
// Wrong — package removed in RN 0.72
presets: ['module:metro-react-native-babel-preset']
This causes Metro to throw:
Cannot find module 'metro-react-native-babel-preset'
Additional Issues
-
CLI installs react-native-reanimated@~4.1.0 which is
incompatible with RN 0.86. Requires manual upgrade to 4.4.1.
-
react-aria dependency pulls in react-dom which doesn't
exist in RN. Requires metro.config.js resolver fix:
extraNodeModules: { 'react-dom': require.resolve('react-native') }
- CLI copies docs/, examples/, .handlebars files into project
alongside component files. Only index.tsx files should be copied.
Fix
- Update CLI template to use
@react-native/babel-preset
- Update reanimated peer dependency to support RN 0.84+
- Exclude docs/examples from component copy operation
Environment
Problem
Running
npx gluestack-ui initon a fresh RN 0.86 projectoverwrites
babel.config.jsand replaces the correct preset:with the deprecated one:
This causes Metro to throw:
Cannot find module 'metro-react-native-babel-preset'
Additional Issues
CLI installs
react-native-reanimated@~4.1.0which isincompatible with RN 0.86. Requires manual upgrade to 4.4.1.
react-ariadependency pulls inreact-domwhich doesn'texist in RN. Requires metro.config.js resolver fix:
alongside component files. Only index.tsx files should be copied.
Fix
@react-native/babel-preset