How to type state in React Hooks without adding typescript (like prop-type - in a simple way)

Question

Just wonder.

If I don't want to add TS to my React project, but I need sometimes some types checking.

While for props I have a simple solution of prop-types, for state I can't do nothing.

So is there is some solution for that?

import PropTypes from 'prop-types';
//https://reactjs.org/docs/typechecking-with-proptypes.html - prop-types

    
export  function GreetingHook (props) {
    
    const [name2, setName2] = useState(10);//won't generate a warning.

    {
        return (
            <h1>Hello, {props.name}</h1>
        );
    }
}

GreetingHook.propTypes = {
    name: PropTypes.string,
    name2: PropTypes.string
};

//Some parent...
//Will generate a warning
<GreetingHook name = {5}/>

NB - The same question should be asked about class component too.

Answer 1

You can use flow instead of typescript, and for typechecking you can do it in this way:

const [name2, setName2] = useState(10);
(name2: number);