CODEWITHSUNDEEP
iosreact-nativebabeljs
Prasanth
Prasanth

Reputation: 681

New react-native app has 'TypeError: babelHelpers.typeof is not a function' [iOS]

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

Upvotes: 20

Views: 7230

Answers (7)

Kyle Finley
Kyle Finley

Reputation: 11992

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

Upvotes: 30

Cory Robinson
Cory Robinson

Reputation: 5272

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

Upvotes: 0

Tom Goldenberg
Tom Goldenberg

Reputation: 566

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"]
}

Upvotes: 2

Nick Sarafa
Nick Sarafa

Reputation: 997

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

Upvotes: 0

Adam Loving
Adam Loving

Reputation: 443

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

Upvotes: 4

ken4z
ken4z

Reputation: 1390

I updated to the newly released [email protected] 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".

Upvotes: 1

Samuel Barbosa
Samuel Barbosa

Reputation: 782

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

Upvotes: 6

Related Questions