Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Export namespace should be first transformed by @babel/plugin-proposal-export-namespace-from on export * as default from './Animated'; #3410

Closed
tomekzaw opened this issue Jul 26, 2022 · 4 comments · Fixed by #3437
Assignees
Labels
Maintainer issue Issue created by a maintainer

Comments

@tomekzaw
Copy link
Member

tomekzaw commented Jul 26, 2022

Description

Starting from Reanimated 2.9.0, if you forget to add Reanimated's Babel plugin, instead of a user-friendly error message, the following error will appear:

error: node_modules/react-native-reanimated/src/index.ts: /Users/tomekzaw/RNOS/Issue3397/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 |
Android iOS
iOS error Android error

funny meme

Solution

  1. Add Reanimated's babel plugin to your babel.config.js:
module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
+  plugins: ['react-native-reanimated/plugin'],
};
  1. Clear application cache (depending on your workflow or favourite package manager):
  • yarn start --reset-cache
  • OR: npm start -- --reset-cache
  • OR: expo start -c
  1. Reload app

See installation docs for more details.

Disclaimer

Obviously, we need to restore the original user-friendly error message:

@tomekzaw tomekzaw added Needs review Issue is ready to be reviewed by a maintainer Maintainer issue Issue created by a maintainer and removed Needs review Issue is ready to be reviewed by a maintainer labels Jul 26, 2022
@DiyarYelbaka
Copy link

Bro you saved my life ! Thank you :)

@justindc100
Copy link

Thank you for this! was about to pull my hair out

piaskowyk added a commit that referenced this issue Aug 17, 2022
## Description

Tree-shaking requires `export * as default` syntax, but this syntax requires the babel plugin `@babel/plugin-proposal-export-namespace-from`. Previously I embedded this plugin inside the Reanimated plugin, but this doesn't work when someone doesn't add Reanimated plugin to their project. In this situation, users receive misleading information about syntax errors instead of messages about missing plugin configuration.

Tree-shaking works only for the web, so I used `as default` syntax only for web implementation. In addition, I updated the exception message. 
The file `index.web.ts` contains information about exceptions in the comment because this is the only possibility to give users information on exceptions during static analyzes of code.

Fixes #3410
@PerryRylance
Copy link

Brilliant, thanks folks

@jdc0092
Copy link

jdc0092 commented Sep 28, 2022

Hello friend, it works quite well for me. Thank you for your contribution and help, greetings! 👍

fluiddot pushed a commit to wordpress-mobile/react-native-reanimated that referenced this issue Jun 5, 2023
## Description

Tree-shaking requires `export * as default` syntax, but this syntax requires the babel plugin `@babel/plugin-proposal-export-namespace-from`. Previously I embedded this plugin inside the Reanimated plugin, but this doesn't work when someone doesn't add Reanimated plugin to their project. In this situation, users receive misleading information about syntax errors instead of messages about missing plugin configuration.

Tree-shaking works only for the web, so I used `as default` syntax only for web implementation. In addition, I updated the exception message. 
The file `index.web.ts` contains information about exceptions in the comment because this is the only possibility to give users information on exceptions during static analyzes of code.

Fixes software-mansion#3410
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Maintainer issue Issue created by a maintainer
Projects
None yet
Development

Successfully merging a pull request may close this issue.

6 participants