ESLintメモ

eslint-plugin-reactのreact/jsx-keyが、React.Fragmentの短縮構文（<>...</>）に効かなかった。

react/jsx-keyは、JSX内で配列を展開するときに、keyの指定し忘れを警告してくるやつ。しかし、次のようなReact.Fragmentの短縮構文に対しては警告してくれなかった。

array.map((item) => (
  <>
    <div>{item.title}</div>
    <div>{item.description}</div>
  </>
))

ドキュメントを見て、react/jsx-keyがReact.Fragmentの短縮構文に対しても効くためには、次のようにcheckFragmentShorthandオプションを有効にする必要があるのだと知った。

"react/jsx-key": ["error", { checkFragmentShorthand: true }]

このcheckFragmentShorthandオプションは、次のメジャーバージョンではデフォルトで有効になるらしい。