React Hooks issues in React 16.7 TypeError: Object(...) is not a function

Viewed 23813

I'm running the latest version of React and I'm getting this error enter image description here I have a simple Component using React Hooks as you can see here :

import React, { useState } from "react";

const AppFunction = () => {
  const [count, setCount] = useState(0);

  const incrementCount = () => {
    setCount(count + 1);
  };
  return (
    <div>
      <h1>Count:{count} </h1>
      <button onClick={incrementCount}>Click Me</button>
    </div>
  );
};

export default AppFunction;

Everything i've found about it on stack overflow says to upgrade the libraries but I have the latest version (16.7.0) and have tried the alpha version with no luck , what am i doing wrong?

package.json

"dependencies": {
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-scripts": "2.1.1"
  },
3 Answers

UPDATE

Hooks are now release as part of React v16.8.0. You can use hooks by upgrading your react version

See the docs for more details on the APIs


React 16.7.0 Doesn't contain hooks.

As per the React blog

Our latest release includes an important performance bugfix for React.lazy. Although there are no API changes, we’re releasing it as a minor instead of a patch.

In order to run hooks in your code, refer How to use new Feature Hooks in React?

I tried to use the following in package.json but do not work.

"react": "16.7.0-alpha.2",
"react-dom": "16.7.0-alpha.2",

What worked is the following

"react": "next",
"react-dom": "next",

EDIT

React version v16.8.0 has Hooks inside. Use that.

edit package.json

"react": "16.7.0-alpha.2",
"react-dom": "16.7.0-alpha.2",
"react-router-dom": "4.4.0-beta.6",

and run yarn

The react released 16.7.0, but there are no react hooks. If you use '^react@16.7.0-alpha.2', remove yarn.lock, it will install react@16.7.0. So you must delete '^' and use 'react@16.7.0-alpha.2'.

Related