react: TypeError: Object(...) is not a function
Do you want to request a feature or report a bug?
Bug 🐛🐛 (May be 🤔🙄)
What is the current behaviour?
I have created react functional component and implement state full logic using useState
method but it throws an TypeError: Object(...) is not a function
Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?
Installed packages
"dependencies": {
"@reach/router": "^1.2.1",
"formik": "^1.4.1",
"prop-types": "^15.6.2",
"react": "^16.7.0-alpha.2",
"react-dom": "^16.7.0-alpha.2",
"react-scripts": "2.1.1",
"styled-components": "^4.1.3",
"yup": "^0.26.6"
},
Github repository : https://github.com/sagar-gavhane/workbench-client
Website: https://wonderful-allen-a3058d.netlify.com/
Screenshot:
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Reactions: 35
- Comments: 44 (2 by maintainers)
Commits related to this issue
- Hotfix due to https://github.com/facebook/react/issues/14484 — committed to gorilla-devs/GDLauncher by blarfoon 5 years ago
@sagar-gavhane you got a few glitches in your project setup. /src/components/Input/input.js
Line 1 should be import Input from ‘./Input.jsx’
/src/screens/auth/Login/Login.jsx Line 1 should be import Input from ‘…/…/…/components/Input/input.js’
and in package.json use “react”: “next”, “react-dom”: “next”,
You should be good after that.
I ran into this issue as well because somehow I assumed that Hooks moved into
16.7.0-alpha.2
. But I had to usenext
instead. Thanks @nikilokBoth
16.7.0-alpha.2
andnext
(which we’ve fixed to point to it) should work.Might help someone: Make sure you aren’t
import { Foo } from 'Foo'
when you should beimport Foo from 'Foo'
. That is… this error is actually pretty descriptive and you can confirm it by commenting out the erroring out code, then doing something likeconsole.log(typeof Foo)
to see if it is an actual function or if it’s something completely different.This error might happen if you use old React. It’s not even a React error — you’re calling
React.useState()
, and if that doesn’t exist (such as in old versions), it’s like callingReact.lalalala()
. The function doesn’t exist, so you’re callingundefined()
and it crashes.It might also happen if you call a non-existent method on some other library.
I have the same error and just figure it out. The problem is when you copy the code from the demo site, this line is not correct:
import { makeStyles } from '@material-ui/core/styles';
Change to this one:
import { makeStyles } from "@material-ui/styles";
Check the docs from here
Hey guys! How are you using
next
to use hooks? FB says they aren’t even releasing yet and that it will be a few months, read here. currently I am using16.7.0-alpha.2
and I still get the error.16.7.0
(latest
) is not with hooks yet. Use16.7.0-alpha.2
(ornext
) instead for now.FYI React v16.7: No, This Is Not The One With Hooks.
I just started getting this error in production. It doesn’t happen in development, though. I’m using 16.8.x. Can anyone shed light on what is actually causing it?
(But 16.8 is the first stable version to have Hooks)
I am still getting the error “TypeError: Object(…) is not a function” for using the useParams from react.
npm install ng2-charts@2.2.0 --save work for me. fine
I was getting the same error. It was due to importing useState from the wrong library. If you’re using >16.8 make sure you have:
import React, { useState } from 'react';
I had to upgrade
react-redux
, delete mynode_modules
, then reinstall.I got the same error, but somehow sorted it well . The issue was due to the React and React- Dom versions. I was using the older versions of React and React-dom. The issue sorted when i upgraded into latest version. Please make sure that you update both React and React-dom at the same time. Run the below commands in cmd to upgrade React . Open your package.json and check your current react and react-dom before updating.
npm install --save react@latest npm install --save react-dom@latest
I was using a named export instead of default and had to remove the brackets
import { useSiteMetadata } from "../hooks/useSiteMetadata"
import useSiteMetadata from "../hooks/useSiteMetadata"
@kami23 I just ran into this error. It could also be an indication that you are importing something in your component which doesn’t exist. For me it was this - import { withNavigation } from ‘@react-navigation/web’; This
withNavigation
doesn’t exist inside the@react-navigation/web
.Hey, your problem is complicated, but i could resolvet. You problem is React version. run this command: npm install react@next react-dom@next --save
Thanks, Dan!