Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Eslint react/prop-types error with TypeScript

I'm getting the Eslint error: 'age' is missing in props validation eslint (react/prop-types) when using extends for interface for React components using the below seemingly valid example:

interface SuperProps {
  age: number;
}

interface TestProps extends SuperProps {
  name: string;
}

const Test = ({ name, age }: TestProps) => {
  return (
    <p>
      {name}: {age}
    </p>
  );
};

Is this a bug or a feature that I haven't fully grasped?

like image 283
Max Gordon Avatar asked Sep 07 '25 00:09

Max Gordon


1 Answers

In case anyone stumbles upon this question, as mentioned in the question comments there was an issue raised regarding this validation rule here: https://github.com/yannickcr/eslint-plugin-react/issues/2654.

The issue is closed but it seems it is not resolved. The validation rule can be disabled by adding

'react/require-default-props': 0

to the rules in your eslintrc.js file

like image 93
Gert-Jan Kooijmans Avatar answered Sep 08 '25 22:09

Gert-Jan Kooijmans