Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ReactNative: babelHelpers.typeof is not a function

On an existing project, that have worked fine over many months and which is already in the AppStores for both iOS and Android, we've got now a break on development with this error:

babelHelpers.typeof is not a function

enter image description here

All what we've done was to try to upgrade an RN-0.26-based Application to a newer version. But even after a rollback the error remains.

We cleared watchman, resetted the packager multiple times. Nothing helped here.

Our package.json looks like this:

{
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "reset": "rm -rf node_modules/ && npm cache clear && watchman watch-del-all && npm i",
    "start": "node node_modules/react-native/local-cli/cli.js start --reset-cache",
    "testflight": "fastlane beta",
    "android-device": "adb reverse tcp:8081 tcp:8081 && react-native run-android",
    "lint": "jslint **.js",
    "test": "mocha test/",
    "generate-apk": "cd android && ./gradlew assembleRelease && open ./app/build/outputs/apk/",
    "install-apk": "cd android && ./gradlew installRelease",
  },
  "devDependencies": {
    "jshint": "latest",
    "mocha": "latest",
    "eslint": "^2.3.0",
    "eslint-config-standard": "^5.1.0",
    "eslint-config-standard-react": "^2.3.0",
    "eslint-plugin-promise": "^1.1.0",
    "eslint-plugin-react": "^4.1.0",
    "eslint-plugin-react-native": "^1.0.0",
    "eslint-plugin-standard": "^1.3.2"
  },
  "dependencies": {
    "apsl-react-native-button": "^2.5.0",
    "babel-preset-es2015": "^6.9.0",
    "babel-preset-react": "^6.11.1",
    "es6-promisify": "^4.1.0",
    "fetch-stuff": "^1.0.1",
    "iap-receipt-validator": "^1.0.2",
    "immutable": "^3.8.1",
    "js-sha256": "^0.3.0",
    "keymirror": "^0.1.1",
    "lodash.difference": "^4.3.0",
    "lodash.find": "^4.4.0",
    "lodash.partialright": "^4.1.4",
    "lodash.remove": "^4.5.0",
    "lodash.shuffle": "^4.0.0",
    "lodash.uniq": "^4.3.0",
    "moment": "^2.14.1",
    "normalizr": "^2.1.0",
    "react": "15.0.2",
    "react-native": "0.26.2",
    "react-native-animatable": "^0.6.1",
    "react-native-app-intro": "^1.0.2",
    "react-native-billing": "^1.3.0",
    "react-native-code-push": "^1.12.2-beta",
    "react-native-code-push-saga": "^1.0.0",
    "react-native-console-panel": "0.0.9",
    "react-native-debug-stylesheet": "^0.1.1",
    "react-native-drawer": "file:./custom_modules/react-native-drawer",
    "react-native-extra-dimensions-android": "^0.17.0",
    "react-native-fabric": "^0.2.3",
    "react-native-fetch-blob": "^0.4.2",
    "react-native-fs": "^1.4.0",
    "react-native-gifted-spinner": "0.0.4",
    "react-native-google-analytics-bridge": "^2.1.0",
    "react-native-htmlview": "^0.5.0",
    "react-native-i18n": "0.0.8",
    "react-native-image-progress": "^0.5.0",
    "react-native-in-app-utils": "^4.0.0",
    "react-native-keyboard-aware-scroll-view": "^0.1.0",
    "react-native-navbar": "^1.5.0",
    "react-native-router-flux": "^3.30.0",
    "react-native-search-bar": "^2.11.0",
    "react-native-side-menu": "^0.19.0",
    "react-native-simple-store": "^1.0.1",
    "react-native-sound": "^0.8.3",
    "react-native-sqlite-storage": "^2.1.6",
    "react-native-swiper": "^1.4.4",
    "react-native-vector-icons": "^2.0.2",
    "react-redux": "^4.4.5",
    "react-timer-mixin": "^0.13.3",
    "redux": "^3.5.2",
    "redux-form": "^6.0.0-alpha.15",
    "redux-logger": "^2.6.1",
    "redux-saga": "^0.10.4",
    "redux-thunk": "^2.1.0",
    "reselect": "^2.5.1",
    "rn-viewpager": "^1.1.2",
    "rnpm": "^1.7.0",
    "tween-functions": "^1.2.0"
  }
}

Can anyone help?

like image 813
itinance Avatar asked Aug 18 '16 10:08

itinance


1 Answers

The issue happens because either your project (via a custom .babelrc) or one of your dependencies is relying on a es2015 preset that doesn't work with React Native. The reason for that is because it includes transform-typeof-symbol which calls babelHelpers.typeof that is not bundled with React Native.

If you have a custom babelrc - the solution is simple, just remove this preset. Afterwards, restart packager w/o cache and you should be set.

Note: It maybe one of your dependencies that uses that preset - in such case, there's nothing you can do but try forking it and removing the preset yourself.

like image 102
Mike Grabowski Avatar answered Nov 07 '22 10:11

Mike Grabowski