is missing in props validation react/prop-types 에러 ESLint

ESLint 에러 조치

jsx 사용에 대한 에러내용

  Line 19:11:  'visible' is missing in props validation     react/prop-types
  Line 19:20:  'setVisible' is missing in props validation  react/prop-types

React 버젼 사용에 따라 상이함.

javascript – via – react.proptypes is deprecated since react 15.5.0, use the npm module prop-types instead

warning.js:36 Warning: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead

react/prop-types 해결 예시

모듈 설치

npm install prop-types

주석처리

/* eslint-disable react/prop-types */
문서 제일 상단에 표기 
또는
// eslint-disable-next-line react/prop-types
  Line 19:11:  'visible' is missing in props validation     react/prop-types
  Line 19:20:  'setVisible' is missing in props validation  react/prop-types
으로 사용

규칙 비활성화

  rules: {
    'react/prop-types': 0
  }
아래 템플릿
...
"react/prop-types": [<enabled>, { ignore: <ignore>, customValidators: <customValidator>, skipUndeclared: <skipUndeclared> }]
...
  • enabled: for enabling the rule. 0=off, 1=warn, 2=error. Defaults to 0.
  • ignore: optional array of props name to ignore during validation.
  • customValidators: optional array of validators used for propTypes validation.
  • skipUndeclared: optional boolean to only error on components that have a propTypes block declared.

컴포넌트 재작성

const Button = ({ children, onClick }: ButtonProps) => {
  return <button onClick={onClick} style={styles} type="button">
    {children}
  </button>;
};

VSCode ESLint 설치하여 사용

외부링크 참조 : https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/prop-types.md

덧글 삭제

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다