Node.js – React Native Transform Error

node.jsreact-nativereactjs

Previously had react-native running nicely, don't recall changing anything, then this error which has proved impossible to clear.

environment
Windows 10
react-native-cli: 2.0.1
react-native: 0.47.1
node v6.11.2

fresh install of node.js after uninstalling previous versions and removing all node and npm directories from paths.
fresh install of react-native as per https://facebook.github.io/react-native/docs/getting-started.html

react-native init AwesomeProject
cd AwesomeProject
react-native run-android

also tried

npm i -g react-native-git-upgrade

react-native-git-upgrade

reboot, new project, uninstall node, reinstall node, reinstall react-native, new project.

still same problem.

repeated with react-native-git-upgrade v0.47.0
Wondering if I should try downgrading to an earlier version. Weird thing is it was working a 2 days ago on react-native version downloaded and installed 8-9 days ago.

Repeatedly getting same error as below. lost too much time on this. really hurts.

The development server returned response error code: 500

URL: http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false

Body:
{"message":"TransformError: D:\blah\AwesomeProject\index.android.js: Unexpected token ) (While processing preset: \"D:\\blah\\AwesomeProject\\node_modules\\babel-preset-react-native\\index.js\")","type":"TransformError","lineNumber":0,"description":"","errors":[{"description":"","lineNumber":0}]}
processBundleResult
BundleDownloader.java:170
access$100
BundleDownloader.java:39
onResponse
BundleDownloader.java:139
execute
RealCall.java:135
run
NamedRunnable.java:32
runWorker
ThreadPoolExecutor.java:1133
run
ThreadPoolExecutor.java:607
run
Thread.java:761

Best Answer

This doesn't depend by Node, so there's no point in uninstalling it. What's causing the trouble is that 'react-native init' automatically tried to fetch the wrong version of the package that handles react's babel transform.

To solve it, simply force the usage of the correct version:

If you use yarn:

yarn remove babel-preset-react-native
yarn add babel-preset-react-native@2.1.0 --dev

If you use npm:

npm un -D babel-preset-react-native
npm i -D babel-preset-react-native@2.1.0

I hope this was useful.