升级React Native至0.59.5后遇bundling失败TypeError,已试多法仍无解
Hey there, that Babel error you're hitting is super common when upgrading React Native versions that switch Babel major versions (0.59.x moved fully to Babel 7), and your attempts with different presets make sense—but let's tackle the root causes step by step:
1. First, Nuke All Caches (Critical Fix for "Commented Code Still Errors")
The fact that commenting the error line doesn't fix it means Metro/Watchman is serving cached compiled code, not your updated files. Run this full cache-clearing command in your project root:
watchman watch-del-all && rm -rf node_modules && rm -rf package-lock.json yarn.lock && yarn cache clean && yarn install && rm -rf /tmp/metro-* && rm -rf /tmp/haste-map-* && react-native start --reset-cache
This wipes every possible cache layer: watchman's file watchers, node_modules, yarn/npm caches, and Metro's compiled bundles.
2. Fix Babel Configuration & Dependencies
React Native 0.59.x relies on metro-react-native-babel-preset (not the old babel-preset-react-native or standalone @babel/preset-env). Here's what to adjust:
Update .babelrc
Replace your current config with this official preset for RN 0.59+:
{ "presets": ["module:metro-react-native-babel-preset"] }
Clean Up Conflicting Dependencies
Edit your package.json to remove/upgrade these problematic packages:
- Remove
babel-preset-react-native(metro's preset replaces it entirely) - Remove
@babel/preset-env(metro's preset includes all necessary env config for React Native) - Remove
metro-bundler(RN 0.59 uses the officialmetropackage internally; this old bundler causes version conflicts) - Remove
yoga(React Native includes Yoga by default—installing it separately creates version mismatches) - Upgrade
react-test-rendererto match your React version: change it to"react-test-renderer": "16.8.3" - Remove
react-native-git-upgrade(this tool is deprecated for newer RN versions and can introduce dependency drift)
Ensure Metro Preset Version Matches RN 0.59.5
Your current metro-react-native-babel-preset@0.53.1 is too old for RN 0.59.5. Upgrade it to the compatible version:
yarn add metro-react-native-babel-preset@0.56.4 --dev
(0.56.x is the correct metro preset range for RN 0.59.x)
3. Verify the Fix
After applying the above changes, re-run the full cache-clearing command from step 1, then start your app with react-native run-ios or react-native run-android.
Why This Works
The bindings error stems from Babel's scope traversal breaking due to mismatched presets or stale cached code. By aligning your Babel config with RN 0.59's official metro preset, removing conflicting dependencies, and wiping all caches, you eliminate the two main causes of this issue.
内容的提问来源于stack exchange,提问作者BeniaminoBaggins

