ahauser
ahauser

Reputation: 85

react native error: Export namespace should be first transformed by `@babel/plugin-proposal-export-namespace-from`

I'm encountering an error while loading my app to my IOS via ExpoGo. I've tried the solutions offered by threads describing the same issue which I've linked at the end of this post but I'm still getting the same error. I wasn't using react-native-reanimated as part of the project so I'm confused what caused the error to occur.

Screenshot of my error in console

iOS Bundling failed 2981ms
node_modules\react-native-reanimated\src\index.ts: C:\Users\arthu\development\pathRise\reactNativeStephenGrider\blog\node_modules\react-native-reanimated\src\index.ts: Export namespace should 
be first transformed by `@babel/plugin-proposal-export-namespace-from`.
  5 | export * from './reanimated1';
  6 | export * from './reanimated2';
> 7 | export * as default from './Animated';
    |        ^^^^^^^^^^^^
  8 |
SyntaxError: C:\Users\arthu\development\pathRise\reactNativeStephenGrider\blog\node_modules\react-native-reanimated\src\index.ts: Export namespace should be first transformed by `@babel/plugin-proposal-export-namespace-from`.
  5 | export * from './reanimated1';
  6 | export * from './reanimated2';
> 7 | export * as default from './Animated';
    |        ^^^^^^^^^^^^
  8 |
    at File.buildCodeFrameError (C:\Users\arthu\development\pathRise\reactNativeStephenGrider\blog\node_modules\@babel\core\lib\transformation\file\file.js:249:12)
    at NodePath.buildCodeFrameError (C:\Users\arthu\development\pathRise\reactNativeStephenGrider\blog\node_modules\@babel\traverse\lib\path\index.js:145:21)
    at assertExportSpecifier (C:\Users\arthu\development\pathRise\reactNativeStephenGrider\blog\node_modules\@babel\helper-module-transforms\lib\normalize-and-load-metadata.js:112:16)
    at C:\Users\arthu\development\pathRise\reactNativeStephenGrider\blog\node_modules\@babel\helper-module-transforms\lib\normalize-and-load-metadata.js:202:9
    at Array.forEach (<anonymous>)
    at C:\Users\arthu\development\pathRise\reactNativeStephenGrider\blog\node_modules\@babel\helper-module-transforms\lib\normalize-and-load-metadata.js:201:31
    at Array.forEach (<anonymous>)
    at getModuleMetadata (C:\Users\arthu\development\pathRise\reactNativeStephenGrider\blog\node_modules\@babel\helper-module-transforms\lib\normalize-and-load-metadata.js:149:27)
    at normalizeModuleAndLoadMetadata (C:\Users\arthu\development\pathRise\reactNativeStephenGrider\blog\node_modules\@babel\helper-module-transforms\lib\normalize-and-load-metadata.js:58:7)  

my package.json file

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "@react-native-community/masked-view": "^0.1.10",
    "expo": "^44.0.0",
    "expo-status-bar": "~1.2.0",
    "react": "17.0.1",
    "react-dom": "17.0.1",
    "react-native": "0.64.3",
    "react-native-gesture-handler": "~2.1.0",
    "react-native-safe-area-context": "3.3.2",
    "react-native-screens": "~3.10.1",
    "react-native-web": "0.17.1",
    "react-navigation": "^4.4.4",
    "react-navigation-stack": "^2.10.4"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9"
  },
  "private": true
}

my babel.config.js

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ["babel-preset-expo"],
    plugins: ["react-native-reanimated/plugin"],
  };
};

other posts with the same/similar issue:

Stackoverflow post about this same/similar error No. 1

Stackoverflow post about this same/similar error No. 2

Github post about this same/similar error as it relates to react-native-reanimated

Upvotes: 5

Views: 799

Answers (0)

Related Questions