react-native: RN project fails with "Property body[6] of BlockStatement..." (Babel related issue)

this is a known issue caused by a bug in a newly released version of babel. it will impact all new react-native and expo apps. you can resolve it with yarn resolutions in a new project:

--- a/package.json
+++ b/package.json
@@ -25,5 +25,8 @@
   },
   "jest": {
     "preset": "react-native"
+  },
+  "resolutions": {
+    "@babel/plugin-transform-react-display-name": "7.14.5"
   }
 }

see some discussion here:

• https://twitter.com/notbrent/status/1423152953876176897
• https://twitter.com/notbrent/status/1423153268423790594

@Revolt9k me and @nicolo-ribaudo have just done a pairing session to verify that @babel/plugin-transform-react-display-name version 7.15.1 works correctly.

So, to more completely provide a resolution if you are still experiencing the problem:

1. check your yarn/npm lock file. Remove the lines/section about

"@babel/plugin-transform-react-display-name@^7.0.0":
  version "7.15.0"
  // more lines

1. (optional) remove your node_modules folder
2. do a yarn/npm install. Afterwards, check the yarn / npm lock file. You should see something like this in place:

"@babel/plugin-transform-react-display-name@^7.0.0":
  version "7.15.1" <--- THIS IS THE VERSION YOU NEED TO HAVE
  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-display-name/-/plugin-transform-react-display-name-7.15.1.tgz#6aaac6099f1fcf6589d35ae6be1b6e10c8c602b9"
  integrity sha512-yQZ/i/pUCJAHI/LbtZr413S3VT26qNrEm0M5RRxQJA947/YNYwbZbBaXGDrq6CG5QsZycI1VIP6d7pQaBfP+8Q==
  dependencies:
    "@babel/helper-plugin-utils" "^7.14.5"

1. Now, reset the reset your Metro cache; you can do it in a few ways, the one I use the most is to kill off the running instance, and re-start it via yarn start --reset-cache. You can also do a more complete nuke via rm -rf $TMPDIR/metro-*.

Doing so will ensure that Metro will pick up the correct plugin and things should work again for you too 😃

This error started to come out today too.

We are sorry for this, I’m reverting the change at https://github.com/babel/babel/pull/13637.

you can also remove the current @babel/core from the package.json and install this version npm install --save-dev @babel/ core@7.12.9

Same for us, started about three hours ago.

this are my dependencies "@babel/core": "7.14.6", "@babel/runtime": "7.14.6"

@pulnec how is that working? @babel/runtime version 7.12.9 does not exist.

Apparently it may be a problem with the babel, copy the folder ‘@babel’ that is in the node_modules of a working project, in the new project and it ran without problems.

it may be due to an update they did a couple of hours ago

Thank you guys, reseting Metro cache finally fixes the issue. You are amazing ❤️.

@nicolo-ribaudo Lockfile is too long to put it here, so I had to upload it in readme file in empty repository. You can check it there - https://github.com/Revolt9k/lockfile

@douglowder @babel/core