I updated react-native to v0.57 and react-native run-ios is failing. I replaced babel-preset-react-native with metro-react-native-babel-preset as suggested in . here is the error stack trace I am getting.

error: bundling failed: Error: Cannot find module 'babel-preset-react-native' from '/Users/buraktas/workspace/reactnative'
- If you want to resolve "react-native", use "module:react-native"
    at Function.module.exports [as sync] (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/node_modules/resolve/lib/sync.js:58:15)
    at resolveStandardizedName (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/files/plugins.js:101:31)
    at resolvePreset (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/files/plugins.js:58:10)
    at loadPreset (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/files/plugins.js:77:20)
    at createDescriptor (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/config-descriptors.js:154:9)
    at items.map (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/config-descriptors.js:109:50)
    at Array.map (<anonymous>)
    at createDescriptors (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/config-descriptors.js:109:29)
    at createPresetDescriptors (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/config-descriptors.js:101:10)

package.json

{
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "rnpm": {
    "assets": [
      "./assets/fonts/"
    ]
  },
  "dependencies": {
    "axios": "^0.17.1",
    "moment": "^2.20.1",
    "moment-timezone": "^0.5.14",
    "react": "16.2.0",
    "react-native": "^0.57.8",
    "react-native-branch": "^2.3.0",
    "react-native-camera": "^1.0.0",
    "react-native-datepicker": "^1.6.0",
    "react-native-deep-linking": "^2.1.0",
    "react-native-fabric": "^0.5.1",
    "react-native-keyboard-aware-scroll-view": "^0.4.3",
    "react-native-modal": "^4.1.1",
    "react-navigation": "^1.0.0-beta.22",
    "react-redux": "^5.0.6",
    "redux": "^3.7.2",
    "redux-form": "^7.1.2",
    "redux-saga": "^0.16.0",
    "stripe-client": "^1.1.3"
  },
  "devDependencies": {
    "@babel/core": "^7.0.0",
    "@babel/preset-flow": "^7.0.0",
    "babel-core": "^7.0.0-bridge.0",
    "babel-eslint": "^10.0.1",
    "babel-jest": "^23.4.2",
    "babel-preset-airbnb": "^3.2.0",
    "detox": "^9.0.4",
    "eslint": "^5.12.0",
    "eslint-config-airbnb": "^17.1.0",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-jsx-a11y": "^6.1.2",
    "eslint-plugin-react": "^7.12.3",
    "eslint-plugin-react-native": "^3.6.0",
    "jest-cli": "^23.6.0",
    "metro-react-native-babel-preset": "^0.51.1",
    "react-test-renderer": "16.0.0",
    "remote-redux-devtools": "^0.5.12"
  },
  "jest": {
    "preset": "react-native"
  }
}

.babelrc

{
  "presets": [
    "airbnb",
    "@babel/preset-env",
    "module:react-native",
    "module:metro-react-native-babel-preset"
  ]
}

I updated react-native to v0.57 and react-native run-ios is failing. I replaced babel-preset-react-native with metro-react-native-babel-preset as suggested in https://www.npmjs./package/babel-preset-react-native. here is the error stack trace I am getting.

error: bundling failed: Error: Cannot find module 'babel-preset-react-native' from '/Users/buraktas/workspace/reactnative'
- If you want to resolve "react-native", use "module:react-native"
    at Function.module.exports [as sync] (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/node_modules/resolve/lib/sync.js:58:15)
    at resolveStandardizedName (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/files/plugins.js:101:31)
    at resolvePreset (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/files/plugins.js:58:10)
    at loadPreset (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/files/plugins.js:77:20)
    at createDescriptor (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/config-descriptors.js:154:9)
    at items.map (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/config-descriptors.js:109:50)
    at Array.map (<anonymous>)
    at createDescriptors (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/config-descriptors.js:109:29)
    at createPresetDescriptors (/Users/buraktas/workspace/reactnative/node_modules/@babel/core/lib/config/config-descriptors.js:101:10)

package.json

{
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "rnpm": {
    "assets": [
      "./assets/fonts/"
    ]
  },
  "dependencies": {
    "axios": "^0.17.1",
    "moment": "^2.20.1",
    "moment-timezone": "^0.5.14",
    "react": "16.2.0",
    "react-native": "^0.57.8",
    "react-native-branch": "^2.3.0",
    "react-native-camera": "^1.0.0",
    "react-native-datepicker": "^1.6.0",
    "react-native-deep-linking": "^2.1.0",
    "react-native-fabric": "^0.5.1",
    "react-native-keyboard-aware-scroll-view": "^0.4.3",
    "react-native-modal": "^4.1.1",
    "react-navigation": "^1.0.0-beta.22",
    "react-redux": "^5.0.6",
    "redux": "^3.7.2",
    "redux-form": "^7.1.2",
    "redux-saga": "^0.16.0",
    "stripe-client": "^1.1.3"
  },
  "devDependencies": {
    "@babel/core": "^7.0.0",
    "@babel/preset-flow": "^7.0.0",
    "babel-core": "^7.0.0-bridge.0",
    "babel-eslint": "^10.0.1",
    "babel-jest": "^23.4.2",
    "babel-preset-airbnb": "^3.2.0",
    "detox": "^9.0.4",
    "eslint": "^5.12.0",
    "eslint-config-airbnb": "^17.1.0",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-jsx-a11y": "^6.1.2",
    "eslint-plugin-react": "^7.12.3",
    "eslint-plugin-react-native": "^3.6.0",
    "jest-cli": "^23.6.0",
    "metro-react-native-babel-preset": "^0.51.1",
    "react-test-renderer": "16.0.0",
    "remote-redux-devtools": "^0.5.12"
  },
  "jest": {
    "preset": "react-native"
  }
}

.babelrc

{
  "presets": [
    "airbnb",
    "@babel/preset-env",
    "module:react-native",
    "module:metro-react-native-babel-preset"
  ]
}

• javascript
• reactjs
• react-native
• babeljs

2 Answers 2

Deleting .babelrc file will fix this for you.

Please check react native upgrade helper

https://react-native-munity.github.io/upgrade-helper

and specify your current React native version and the version to update (0.57 in your case)

You will see changes need to do in your case to make the code patible with updated version

Looking at your package.json it looks like all you have done is upgrade the version of react-native to the latest version.

Unfortunately it is not as simple as changing the version number in the package.json. You don't state which version of react-native you were using before, but as you are using React 16.2.0 I would hazard a guess that you were on react-native 0.52 or 0.53.

To upgrade you should look at the diff that is provided between your version and the version that you upgrading to. rn-diff-purge shows the changes between that need to be performed. For upgrading 0.52.0 to 0.57.8 you can see the changes here, for 0.53.0 to 0.57.8 you can see the changes here.

You can check the changelog https://github./react-native-munity/react-native-releases/blob/master/CHANGELOG.md to see more specific requirements for upgrading between the versions.

It is also worthwhile looking at https://facebook.github.io/react-native/docs/upgrading for tips on how to perform an upgrade.