react-native-reanimated 和 babel 的编译错误

Question

我想将 react-native-reanimated 添加到我的项目中，我遵循了 installation guide 并且在为 Babel 添加插件时我在启动应用程序时收到错误消息：

error: index.js: [BABEL] W:\folders\project\index.js: Unknown option: .pre. Check out https://babeljs.io/docs/en/babel-core/#options for more information about options.

我正在使用 Android device，因此我启用了 Hermes 并在 MainApplication 中创建了该方法。我怎么解决这个问题？我必须在 GitHub 上发布问题吗？

babel.config.js

module.exports = {
  presets: [
    'module:metro-react-native-babel-preset',
    'react-native-reanimated/plugin',
  ],
};

依赖关系

"react": "17.0.1",
"react-native": "0.64.1",
"react-native-gesture-handler": "^1.10.3",
"react-native-reanimated": "2.3.0-beta.1",
"metro-react-native-babel-preset": "^0.64.0",

尝试过的解决方案：

运行 react-native start --reset-cache.
删除 node_modules 并重新安装。
正在更改库版本。

Answer 1

我遇到了同样的问题，然后意识到它应该在 plugins，而不是 presets。只需将 'react-native-reanimated/plugin' 移动到插件中：

module.exports = {
  presets: [
    'module:metro-react-native-babel-preset',
-   'react-native-reanimated/plugin',
  ],
+ plugins: [
+   'react-native-reanimated/plugin'
+ ],
}

react-native-reanimated 和 babel 的编译错误

Compilation error with react-native-reanimated and babel

javascript

babeljs

react-native

react-native-reanimated