Component definition is missing display name react/display-name 에러

ESLint 에러 조치

jsx 사용에 대한 에러내용

  Line 14:15:  Component definition is missing display name  react/display-name

잘못된 예시

var Hello = createReactClass({
  render: function() {
    return <div>Hello {this.props.name}</div>;
  }
});

const Hello = React.memo(({ a }) => {
  return <>{a}</>
})

export default ({ a }) => {
  return <>{a}</>
}

올바른 예시

var Hello = createReactClass({
  displayName: 'Hello', /** displayName ..*/
  render: function() {
    return <div>Hello {this.props.name}</div>;
  }
});

const Hello = React.memo(function Hello({ a }) {
  return <>{a}</>
})

규칙 비활성화

...
"react/display-name": [<enabled>, { "ignoreTranspilerName": <boolean> }]
...

외부링크 : https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/display-name.md