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

南门野
2023-12-01

一、问题

  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
  1. 环境
react-native-cli: 2.0.1
react-native: 0.47.1
node -v: v6.2.1
npm -v: 5.3.0
yarn -v: v0.27.5

二、原因

babel-preset-react-native版本不匹配

三、解决

  1. 执行以下命令行
// 如果安装了yern
yarn remove babel-preset-react-native
yarn add babel-preset-react-native@2.1.0

或者

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

四、参考

stackoverflow
react-native/issues/15513

 类似资料: