React 17以降を使用していてeslintのreact-in-jsx-scopeでlintされる件の対応

React17以降から、JSXで記述しても毎回Reactをimportしなくても良くなりました。
詳しくはReact公式ブログ新しいJSXトランスフォームを読むとよさそうです。
React17以降のJSXトランスフォームはパフォーマンスが改善されていたりするそうです。わざわざファイルごとにimport React from 'react';を書く必要がなくなるのも良い点ですね

ESLintでのLintエラーの対応方法を記しておきます。

対応方針1: ESLint設定ファイルのextendsを拡張する

.eslintrc.jsonなどの設定ファイルを適宜変更

{
  // ...
  "rules": {
    // ...
    // ↓を追記
    "plugin:react/jsx-runtime"
  }
}

対応方針2: ESLint設定ファイルのruleで無効にする

.eslintrc.jsonなどの設定ファイルを適宜変更

{
  // ...
  "rules": {
    // ...
    // ↓を追記
    "react/react-in-jsx-scope": "off"
  }
}

参考

• ESLint公式ドキュメント/react-in-jsx-scope.md