Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

babelHelpers.objectDestructuringEmpty is not a function #4831

Closed
cancan101 opened this issue Dec 16, 2015 · 30 comments
Closed

babelHelpers.objectDestructuringEmpty is not a function #4831

cancan101 opened this issue Dec 16, 2015 · 30 comments
Labels
Resolution: Locked This issue was locked by the bot.

Comments

@cancan101
Copy link
Contributor

I upgraded from RN 15 to RN 16 and now I get:
babelHelpers.objectDestructuringEmpty is not a function:
image

Currently my .babelrc files looks like:

{
  "presets": ["react"],
  "plugins": [
    "transform-decorators-legacy",
    "transform-es2015-classes",
    "transform-export-extensions"
  ]
}

I previously also had es2015 in the presets list but then I got: http://stackoverflow.com/questions/34112110/upgrade-to-react-native-0-16-error.

@facebook-github-bot
Copy link
Contributor

Hey cancan101, thanks for reporting this issue!

React Native, as you've probably heard, is getting really popular and truth is we're getting a bit overwhelmed by the activity surrounding it. There are just too many issues for us to manage properly.

  • If you don't know how to do something or not sure whether some behavior is expected or a bug, please ask on StackOverflow with the tag react-native or for more real time interactions, ask on Discord in the #react-native channel.
  • If this is a feature request or a bug that you would like to be fixed, please report it on Product Pains. It has a ranking feature that lets us focus on the most important issues the community is experiencing.
  • We welcome clear issues and PRs that are ready for in-depth discussion. Please provide screenshots where appropriate and always mention the version of React Native you're using. Thank you for your contributions!

@udfalkso
Copy link

Hi @cancan101 I'm also hitting this issue. Did you manage to solve it? Thanks

@cancan101
Copy link
Contributor Author

Try adding "transform-runtime" to the plugins.

@udfalkso
Copy link

Thanks. Did you have to add [email protected] to your package file to get this to work? (See: https://phabricator.babeljs.io/T2759)

I've tried that and now I get this problem:

Error: 
 stack: Error: Requiring unknown module "babel-runtime/core-js/number/min-safe-integer". If you are sure the module is there, try restarting the packager.
    at requireImpl (http://192.168.20.127:8081/index.ios.bundle?platform=ios&dev=true:48:7)

But this file is there.

(develop)[udi@udis-mac:node_modules/babel-runtime]$ find . -name "*min-safe-integer*" -print
./core-js/number/min-safe-integer.js
./node_modules/core-js/fn/number/min-safe-integer.js
./node_modules/core-js/library/fn/number/min-safe-integer.js
./node_modules/core-js/library/modules/es6.number.min-safe-integer.js
./node_modules/core-js/modules/es6.number.min-safe-integer.js

@udfalkso
Copy link

@cancan101 Any chance you could share what's in your package.json and .babelrc files? Would be very helpful, thanks!

@udfalkso
Copy link

Finally managed to get past this error. It turns out that I had code like this that needed to be removed:

var {
} = React;

@cancan101
Copy link
Contributor Author

That worked for me as well.

@cancan101
Copy link
Contributor Author

Is this some sort of know issue ? How did you figure it out.

@udfalkso
Copy link

Just a lot of digging around and trial and error.

@satya164
Copy link
Contributor

You seem to be using very few transforms, and missing lots of transforms like destructuring, which might be causing the issue. It'll be better to copy/extend React Native's .babelrc and add what you need.

@udfalkso
Copy link

Aren't those transforms automatically being run by the RN packager @satya164 ? This was a special case of destructuring an empty object which I think caused the problem here.

@satya164
Copy link
Contributor

@udfalkso Yeah, in your case yes. But the packager uses your .babelrc instead if you have one, or at least that's how it used to be. I haven't tried with a custom .babelrc in the latest version though.

@cancan101
Copy link
Contributor Author

Right now I am using a .babelrc of:

{
  "presets": [],
  "plugins": [
    "transform-decorators-legacy",
    "transform-export-extensions"
  ]
}

and it works as long as I remove all instances of:

const {
} = React;

@udfalkso
Copy link

I'm using an empty .babelrc file, but using es6 modules and other things. So I assume RN packager is picking up the rest of the slack. Finally all working now.

@cancan101
Copy link
Contributor Author

Is this an issue with Babel 6? A feature?

@marco-amoroso
Copy link

2 days ago we decided to upgrade RN from 0.14 to 0.19, after trial and errors we reached the babelHelpers.objectDestructuringEmpty is not a function error and found this thread. Thanks indeed. We had some function(state, {}) ... in our codebase.

Not sure if it's a feature but it was working fine in Babel 5. Most likely Babel 6 is stricter.

@gelobelo02
Copy link

can someone further explain the solution to this error?

@philolo1
Copy link

I had a similar issue because I used {} at some point, is this an issue with babel, and if so which repo should we report it.

@MutableLoss
Copy link

I found this issue when having braces in place for destructuring, but without any values between the braces.

e.g. const value = ({}) => { ... }

I believe Babel is simply complaining that the object is in fact empty, and does not have any values to destructure.

@sujitpk-perennial
Copy link

For me adding extra curly bracket causing this issue. so I have changed
from renderTextInput= {({}) => ()}
to renderTextInput= {() => (})

@alexthegoodman
Copy link

I too fell down this trap! Yes, you may use an empty object {}, but are you sure you aren't having a syntax error like:

let { } = this.props;

That's what got me!

@patrickleemsantos
Copy link

patrickleemsantos commented Nov 27, 2017

Hi Guys,

I am also experiencing this error when I Run and Build my react native app on XCode.

[error][tid:com.facebook.react.JavaScript] babelHelpers.objectDestructuringEmpty is not a function. (In 'babelHelpers.objectDestructuringEmpty(o.default)', 'babelHelpers.objectDestructuringEmpty' is undefined)

I already tried all the solutions here but still facing the problem.

@HananeAlSamrout
Copy link

i had this issue also, the reason was
let {}=this.state

@mckrava
Copy link

mckrava commented Dec 24, 2017

let { } = some_object;
This "empty definition" in any place of code is a reason of babel error.

@dgreensp
Copy link

It's a shame that the only fix here is "don't do that." Empty destructuring is perfectly valid, and it could be a nice idiom for ignoring an argument, as in ({}, foo) => .... In fact, the Babel helper in question exists specifically to allow destructuring an empty object in a spec-compliant way: babel/babel#681

@punksta
Copy link

punksta commented Apr 20, 2018

I had similar problem:

const removeKey = (key: string, {[key]: {}, ...rest}) => rest;

it works good in debug, but release build chased.

image

fixed by changing {} to _.

const removeKey = (key, {[key]: _, ...rest}) => rest;

@vigneshprabhu20
Copy link

I got this fix upon installing babel helper plugin.

Package.json:
"devDependencies": {
"babel-cli": "6.26.0",
"babel-plugin-external-helpers": "^6.22.0",
....
}

babelrc:
{
"presets": ["react-native", "flow"],
"plugins": [
"external-helpers",
...
]
}

Reference to install this plugin:
https://www.npmjs.com/package/babel-plugin-external-helpers

@RossKinsella
Copy link

My issue was an empty destructuring for the arguments of a function. What's interesting is this was only an issue when I did a production build. In my iOS emulator I didn't get an exception.

@ishigamii
Copy link

ishigamii commented Jun 12, 2018

@vigneshprabhu20 I just tried your solution and sadly I still have the same problem.

I fixed my problem thanks to your comments.
My problem was that one of my render was like this :

_renderHeader = ({}) => {...}

and it should be like this :

_renderHeader = () => {...}

A fix is really needed for this 👍

@ramonprata
Copy link

tks @vigneshprabhu20 you solution worked for me

@facebook facebook locked as resolved and limited conversation to collaborators Jul 20, 2018
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Jul 20, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Resolution: Locked This issue was locked by the bot.
Projects
None yet
Development

No branches or pull requests