'React' must be in scope when using JSX eslint 관련 에러

React 버전 17이전은

React를 import 해야 한다.

import React from 'react';

해주면 해결된다.

React 버전 17 이후부터

ESLint config 옵션을 추가한다.
.eslintrc.js 또는 .eslintrc.json 안에

module.exports = { 
  "rules": {
    "react/react-in-jsx-scope": "off",
    "react/jsx-uses-react": "off",
  }
}

옵션을 추가해주면 된다.

하지만
.eslintrc.json파일은 JSON형식이어야 한다.

{
    "extends": ["react-app", "prettier"],
    "rules": {
      "react/react-in-jsx-scope": "off",
      "react/jsx-uses-react": "off"
    }
  }

이렇게 형식에 맞춰서 작성해줘야 함