17

This is my first React Native project. The repo is here.

When I start up expo, I get the error: 

Cannot find module 'babel-preset-react'

Among others, it has these dependencies:

"expo": "^32.0.0",
"react": "16.8.4",
"react-native": "https://github.com/expo/react-native/archive/sdk-32.0.1.tar.gz",
"@babel/core": "7.3.4",
"babel-core": "^7.0.0-bridge.0",
"@babel/preset-react": "^7.0.0",

I found these four libraries in my app's /node_modules that each contain a dev dependency on "babel-preset-react":

hoist-non-react-statics, prop-types, react-input-autosize and react-proxy.

None of these have newer versions that depend on "@babel/preset-react".

Dan Cancro
  • 1,401
  • 5
  • 24
  • 53

6 Answers6

5

I had this a few, every time I install a new module/plugin. My solution has been to delete node_modules folder and yarn install or npm install.

It stops the error. I'm not sure is the right solution (would be interested to know if it is), but works.

Luiz Henrique Pinto
  • 59
  • 1
  • 3
  • Thank you! It worked for me perfectly. After hours of looking everywhere for solutions, and installing a bunch of (probably unnecessary, who knows) packages, the solution is so simple and clean. – Huyen Jul 20 '22 at 07:04
  • did not work for me – drweird Sep 07 '22 at 16:54
4

I had to change ['react'] to ['@babel/preset-react'] in .bablerc when upgrading from babel 6.x to 7.x:

{
    "presets": [
        "@babel/preset-env",
        "@babel/preset-react",
    ]
}
Mike Szyndel
  • 10,461
  • 10
  • 47
  • 63
ashish siddhu
  • 179
  • 4
  • 5
2

This seems to be an issue to do with an expo project being in a bad state.

Expo is an express set of libs with the goal of simplifying development, but it is not compatible with most react native examples in the wild.

After further review, it looks like you may have followed a regular react native example in an Expo based project, without first ejecting.

Steven Stark
  • 1,249
  • 11
  • 19
  • 1
    Interesting. So I added babel-preset-react (in addition to @babel/preset-react) and got the error: "Preset files are not allowed to export objects, only functions." That led me to this, which didn't solve the problem or suggest that an app should include both packages. https://github.com/babel/babel-loader/issues/540#issuecomment-344023061 – Dan Cancro Mar 08 '19 at 01:19
  • out of curiosity, could you try removing `"babel-preset-expo"` from the presets in package.json? Also, have you tried to eject this project? It's kind of looking to me like a project that's been ejected but is still trying to use expo. I'm not suggesting to eject, there is no going backwards from that, just curious if that's what's going on here. – Steven Stark Mar 08 '19 at 01:23
  • Same thing. The error refers to babel-preset-react:Error: Plugin/Preset files are not allowed to export objects, only functions. In /Users/Dan/work/b/questions/node_modules/babel-preset-react/lib/index.js – Dan Cancro Mar 08 '19 at 01:37
  • I have not tried ejecting. I got where I am by following the new React Native app instructions. It worked fine at that point. Then I copied into it files from a simple React app and modified a few things. – Dan Cancro Mar 08 '19 at 01:41
  • I tried cloning and building your project, but I didn't resolve the issue. I feel it's because you're following articles for react native and not for expo. – Steven Stark Mar 08 '19 at 04:25
  • Okay, thanks for trying! Such is the nature of distributed invention. I'll look around for a good expo example. If you have any favorites please let me know. – Dan Cancro Mar 08 '19 at 14:59
  • I only used expo for a few days before my needs were more than it could handle, I found it very limiting. I suggest if you want to do some more advanced things, or anything custom on the native side at all, to eject right away. After ejecting, you will not have any of the expo libs, and would need to re-implement existing work, so ejecting down the line is a bit of a trap; eject right away or never at all. Good luck with your project! – Steven Stark Mar 08 '19 at 16:00
  • I don't think is really connected to expo or react native, is a mismatching regarding dependencies regarding babel 6 and babel 7 or using both as from this https://stackoverflow.com/questions/49182862/preset-files-are-not-allowed-to-export-objects – Carmine Tambascia Dec 18 '19 at 16:51
1

I had a similar issue wherein I mistyped babel/preset-react as babel-preset-react in the babel config file.

Correcting the typo helped me resolve the issue.

Kumar Gaurav
  • 163
  • 2
  • 10
1

First of all make sure the babel config has '@babel/preset-react' in presets and not 'babel-preset-react'

Apart from that. this did it for me:

npm i @babel/preset-react 

npm i @babel/core
Hritik Bakshi
  • 61
  • 1
  • 3
0

I had this issue after an upgrade. I needed a restart and it was solved. Apparently some caching issue or running process which still uses an old dependency.

FrankyHollywood
  • 1,497
  • 19
  • 18