20

A new project created with the latest version of react-native throws javascript error while running(/debugging). Tested this on simulator. 

[fatal][tid:main] TypeError: babelHelpers.typeof is not a function. (In 'babelHelpers.typeof(target)', 'babelHelpers.typeof' is undefined)

Installed the react-native client today & created the app using 

react-native init AwesomeProject

App version:

react-native-cli: 0.1.10
react-native: 0.20.0
node version: v5.6.0
Prasanth
  • 663
  • 6
  • 15
  • I'm also struggling with this. Some people have had success with these methods...I have not https://github.com/facebook/react-native/issues/5747 – ken4z Feb 23 '16 at 16:22
  • I had `react-native-cli` installed under my home folder using a `.npmrc` with a custom `prefix=/`. I reinstalled the `react-native-cli` after removing this option. New projects created with the new client started working. I still don't know what the real problem is. – Prasanth Feb 23 '16 at 17:39
  • Are you using a .babelrc file ? If yes, can you show us its content ? – G. Hamaide Feb 25 '16 at 10:00
  • I was not using a `.bablerc`. It is a clean project created by running `react-native init`. – Prasanth Feb 25 '16 at 12:12
  • I'm having the same issue with the react-native init and running project :( – Samuel Barbosa Feb 25 '16 at 12:35
  • 1
    I've also run into this, and even after fixing it once via the github issue referenced by @ken4z, it came back and the same fix did not work. This hints at a deeper flaw in the packager code related to its dependencies and caching. Quite frustrating since the last time it popped up for me, I hadn't changed anything (git branch was clean from last known working config...). – Mike Pugh Feb 25 '16 at 15:44

7 Answers7

30

Here's a comment explaining the issue:

https://github.com/facebook/react-native/issues/4844#issuecomment-204035720

To summarize:

Babel presets 'stage-0' through 'stage-3' contain 'async-to-generator', which is not not necessary for react-native itself.

The solution is to use the unofficial babel preset 'react-native-stage-0'

Example:

npm install babel-preset-react-native-stage-0 --save-dev

.babelrc

{
  "presets": ["react-native-stage-0"]
}

or with decorator support

{
  "presets": ["react-native-stage-0/decorator-support"]
}

Empty cache and Restart

watchman watch-del-all

./node_modules/react-native/packager/packager.sh start --reset-cache
Mike Lambert
  • 1,976
  • 1
  • 17
  • 31
Kyle Finley
  • 11,842
  • 6
  • 43
  • 64
6

Solved adding babel stage-1 and react-native preset's to .babelrc in the project's root folder.

{
  "presets": ["stage-1", "react-native"],
}

More details here: https://github.com/facebook/react-native/issues/5747

Bill the Lizard
  • 398,270
  • 210
  • 566
  • 880
Samuel Barbosa
  • 782
  • 7
  • 18
  • 4
    This didn't work for me. It seems that people are sometimes able to strike the right sequence of buttons to get it to work temporarily, but not consistently. It seems there is something more core going on. – ken4z Feb 25 '16 at 20:39
  • This preset results here in an infinite loop of "loading from localhost:8081"... Am i the only one? – itinance Aug 17 '16 at 15:08
4

To solve the problem, I renamed a .babelrc file in a parent directory, then ran ./node_modules/react-native/packager/packager.sh start --reset-cache

Adam Loving
  • 443
  • 5
  • 12
2

One issue is that if there is a .babelrc in a parent directory to your app, the packager will read that and it will cause this exact error. One way around it is to add a .babelrc file in your project:

{
  "presets": ["react-native"]
}
Tom Goldenberg
  • 566
  • 3
  • 6
  • 14
1

I updated to the newly released react-native@0.21 and the issue went away. I am not sure if this means the root issue has been resolved since I have seen intermittent success with other "fixes".

ken4z
  • 1,340
  • 1
  • 11
  • 18
0

Double check your import path/file names as they are case sensitive

Nick Sarafa
  • 986
  • 10
  • 16
0

It's usually due to a 3rd party npm dependency that has .babelrc or babel es2015 preset specified in it's package.json.

There's a fix in place: https://github.com/facebook/react-native/pull/11093

Cory Robinson
  • 4,616
  • 4
  • 36
  • 53