React-Native Demo 工程 TransformError babel-preset-react-native

来源:互联网 发布:淘宝好评20字以上 编辑:程序博客网 时间:2024/06/07 07:10

一、问题
1. 现象
如果你依照RN官方文档或者RN中文网创建工程,你会遇到以下报错:

![bundling failed: "TransformError: /Users/eduardo/Desktop/rn_reproduce_transform_error/index.ios.js: Unexpected token ) (While processing preset: "/Users/eduardo/Desktop/rn_reproduce_transform_error/node_modules/babel-preset-react-native/index.js")"

而没有按照预期显示”Welcome to React Native!”界面。
2. 复现步骤
- react-native init rn_reproduce_transform_error
- cd rn_reproduce_transform_error
- react-native run-ios or react-native run-android
3. 环境

react-native-cli: 2.0.1react-native: 0.47.1node -v: v6.2.1npm -v: 5.3.0yarn -v: v0.27.5

二、原因
babel-preset-react-native版本不匹配

三、解决
1. 执行以下命令行

// 如果安装了yernyarn remove babel-preset-react-nativeyarn add babel-preset-react-native@2.1.0

或者

// 如果安装了npmnpm uninstall babel-preset-react-nativenpm install babel-preset-react-native@2.1.0
  1. 重启终端、模拟器。

四、参考
stackoverflow
react-native/issues/15513