TypeError: Cannot read property 'isRequired' of undefined

Question

I am new in React.js. I am trying to validate the propTypes but it shows the error "TypeError: Cannot read property 'isRequired' of undefined". I will be Thankful for the suggestions.

import React from "react";
import classnames from "classnames";
import PropTypes from "prop-types";

const TextFieldGroup = ({
  name,
  palceholder,
  value,
  label,
  error,
  info,
  type,
  onChange,
  disabled
}) => {
  return (
    <div className="form-group">
      <input
        type={type}
        className={classnames("form-control form-control-lg", {
          "is-invalid": { error }

      {error && <div className="invalid-feedback">{error}</div>}
    </div>
  );
};

TextFieldGroup.propTypes = {
  name: PropTypes.string.isRequired,
  palceholder: PropTypes.string,
  value: PropTypes.string.isRequired,
  label: PropTypes.string,
  error: PropTypes.string,
  info: PropTypes.string,
  type: PropTypes.string.isRequired,
  onChange: PropTypes.func.isRequired,
  disabled: PropTypes.string
};

TextFieldGroup.defaultProps = {
  type: "text"
};

export default TextFieldGroup;

Answer 1

Import should be like this.

import {PropTypes} from "prop-types";

Answer 2

Are you sure the error is located in this component? I had the same error because of this:

  EmptySearchResults.propTypes = {
      searchMessage: PropTypes.message.isRequired
  };

Because message is not a propType.

Answer 3

My mistake was that it was not install correctly the prop-types library,I fixed the problem after reinstallation $ npm i [email protected]

Answer 4

My mistake was as follows:

// **BAD**
StatusUpdate.propTypes = {
   loading: PropTypes.boolean.isRequired
};

boolean is not an available type; it's bool. smh.

So change to:

// **GOOD**
StatusUpdate.propTypes = {
   loading: PropTypes.bool.isRequired
};