Problem Upgrading to SDK 31 (Cannot Find Babel Plugin 'transform-react-jsx-source')

Essentially, the error seems to come down to this…

/node_modules/expo/AppEntry.js: Cannot find module ‘babel-plugin-transform-react-jsx-source’

Causing a 500 server response.

After following the upgrade instructions in the expo article on medium, I ran yarn and got the following warnings and a detox related error which may be relevant, especially since it exited…but I’m not sure how to resolve nor am I sure how/why the detox postinstall script is being run.

I’ve tried wiping out the node_modules directory and stepping through the upgrade steps a couple times, but always with the same result.

1 Like

Apparently I needed to simplify my babel config

10 Likes

Where did you find the information that suggested you simplify your babelrc? I attempted to do what you did but still got the same error, even after deleting my node modules, clearing cache, and re-installing via yarn. I ran
yarn add @babel/plugin-transform-react-jsx-source
and found my project working again…

My .babelrc now looks like this:

  "presets": ["babel-preset-expo"],
  "env": {
    "development": {
      "plugins": ["@babel/plugin-transform-react-jsx-source"]
    }
  }
}
2 Likes

Hmmm, that’s interesting because that broke my config. The fix I described above solved the problem described (for me), but broke my jest tests so further changes had to be made. My babel.config.js file now looks like this…

module.exports = function(api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: [
      [
        '@babel/transform-runtime',
        {
          regenerator: true,
        },
      ],
    ],
  };
};

as always, YMMV

3 Likes

it should look like this: https://github.com/expo/new-project-template/blob/master/babel.config.js

if you’re ever in doubt you can init a new project and check its babel config

2 Likes

Thanks for weighing in, Brent. I’m out of my depths here and got some guidance from SWM on my config, but my current config matches your reference with added plugins. Is that good, bad, or ¯\_(ツ)_/¯ in your opinion?

you shouldn’t need to add that plugin, it’s already included in the react-native babel preset which is a subset of the expo preset - https://github.com/facebook/metro/blob/28830458856217e85430acd0971e415723714ef8/packages/metro-react-native-babel-preset/src/configs/main.js#L74-L80

1 Like

I have the same problem
node_modules/expo/AppEntry.js: Cannot find module ‘babel-plugin-transform-react-jsx-source’

you need to remove .babelrc and add babel.config.js like this: https://github.com/expo/universe/blob/20d3b211c1057fb7eb943220c9f05ac90c7ab34b/apps/expo-template-tabs/babel.config.js

2 Likes

@notbrent this link is broken

1 Like

thanks a lot this worked for me!

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.